background-clipを使って文字にグラデーションをかける

以前はグラデーションはビットマップで表現していましたが、今cssで描画するのが一般的です。cssで描画するものはベクター形式になるので、ビットマップよりも滑らかなグラデーションが表現できます。

「background-clip」を使う事で文字に対してグラデーションをかける事が出来るので、見出しにグラデーションをかけてみましょう。

-webkit-background-clip: text;
color: transparent;