蛍光マーカー風ハイライト（黄）

解説

文中の重要語に黄色い蛍光マーカーを引いたような半透明ハイライトです。mark 要素の background に linear-gradient(transparent 60%, rgba(...) 60%) を指定し、上 60% を透明・下 40% だけ色を乗せることで、文字の下側にだけマーカーが当たった手書き風の見え方を作っています。塗りが半透明なので下の文字や行が透けて自然です。CSS だけで完結し、JS は使いません。

向いている場面

• 記事中のキーワードや結論の強調
• FAQ や説明文で読者に必ず読ませたい一文
• 料金・特典など見落としたくない箇所

マーカーの高さはグラデーションの境界 60% を上下させて調整します（数値を下げると太く塗れます）。色は rgba の値を変えれば緑や水色のマーカーにもできます。注意点として、強調が多すぎると逆に目立たなくなるため、1 段落につき 1〜2 か所に絞ると効果的です。半透明のため濃い背景上では見えにくくなることがあり、その場合は不透明度（アルファ値）を上げてください。意味的な強調には mark タグが適しています。

使用例・適したシーン

• ヒーローのキャッチコピー
• 見出しの強調
• コーポレートのキービジュアル