自分のサイトで複製しようとしている素敵な CSS デザインをいくつか見つけました。問題は、デザインが画像、つまり実際のページのスクリーンショットとして提示されたことです。これは、自分の CSS でデザインを複製しようとしてきたことを意味します。
ここに問題があります: レンダリングしているテキストは、CSS でグレースケール (すべての RGB 値が等しい) として色付けされていますが、ページのスクリーンショットを作成してズームインすると、テキスト全体に色付きのピクセルが表示されます。元のデザインにはそれらがありません...完全に灰色であるため、はるかに滑らかに見えます.
これは通常のサイズのオリジナルです（非常に滑らかに見えます）：
ここではズームインしています (すべてのピクセルがグレースケールであることに注意してください)。
さて、これが通常のサイズでの私の試みです（見た目がどれほど粗いかに注意してください）：
そしてズームイン（すべての色付きのピクセルを参照）：
ここで何が起こっているのですか？色付きのピクセルなしで元のデザインの滑らかな外観を実現するにはどうすればよいですか?