【追記】2022年3月にリリースされた Safari 15.4 で以下の問題は起きなくなりました。 CSS で色指定をするときに transparent というキーワードが使えますね。 その名のとおり「透明」の指定なんだけど、特定の環境では期待した結果になりません。 これがどう見えるか この四角い領域の表示は閲覧環境によって変わります。 ↓これの左右どっちか。 Mac の Safari では右半分のように黒く濁ったグラデーションになります。黒というか灰色というか。 また iOS, iPadOS だとすべてのブラウザーが右。 Safari だろうが Google Chrome だろうが Firefox だろうが Opera だろうが Microsoft Edge だろうが DuckDuck Go だろうが。 それ以外の環境だと左半分のようにクリアなグラデーションになっているはず。 要するに