パーツ番号 02-01-11 ・ CSSのみ

縁取り→塗りつぶし見出し

表示時に文字のアウトラインだけの状態から、じわっと塗りつぶし色へ変化する見出し。WordPressのブランドコンセプトページのタイトルに知的な印象を与えます。

scrollcss

プレビュー

ソースコード

HTML

<h4 class="d02-01-11-h io-reveal">情熱を、かたちに。</h4>

CSS

.prev.d02-01-11{ background:#f8f7f3; }
        .d02-01-11 .d02-01-11-h{
          font-size:30px;
          font-weight:800;
          letter-spacing:.05em;
          color:transparent;
          -webkit-text-stroke:1.5px #1a2333;
          transition:color 1.1s ease .1s;
        }
        .d02-01-11 .d02-01-11-h.is-in{
          color:#1a2333;
        }

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