パーツ番号 02-02-07 ・ CSSのみ

グラデーションシャイン文字

光沢の帯が文字の上を斜めに繰り返し走り抜けます。WordPressの高級感あるサービス名やキャンペーン見出しにきらめきを加えます。

css

プレビュー

ソースコード

HTML

<h4 class="d02-02-07-txt">PREMIUM</h4>

CSS

.d02-02-07{background:#0f172a}
        .d02-02-07-txt{margin:0;font-size:46px;font-weight:900;letter-spacing:3px;
          background:linear-gradient(110deg,#6b7280 0%,#6b7280 40%,#fff 50%,#6b7280 60%,#6b7280 100%);
          background-size:250% 100%;
          -webkit-background-clip:text;background-clip:text;color:transparent;
          animation:d187shine 3s linear infinite}
        @keyframes d187shine{0%{background-position:150% 0}100%{background-position:-150% 0}}

クラス名 .d02-02-07 は本ライブラリ内での識別用です。複数のパーツを同じページで使う場合は、重複しないよう名前を変更してください。