見出しシミュレーター

見出しの文字サイズ、行間、フォント、色、マージン、パディング、境界線などを調整して、 カスタム見出しを作成できます。作成した見出しのHTML、CSSコードを コピーして、あなたのプロジェクトで使用できます。

見出し選択

見出し設定 (h1)

基本設定

フォント設定

色設定

余白設定

境界線設定

見出しテキスト

PC表示 (h1)

見出しテキスト

PC表示 (h2)

見出しテキスト

PC表示 (h3)

見出しテキスト

PC表示 (h4)
見出しテキスト
PC表示 (h5)
見出しテキスト
PC表示 (h6)

コード

<h1 class="custom-heading heading-1">
  見出しテキスト
</h1>

<h2 class="custom-heading heading-2">
  見出しテキスト
</h2>

<h3 class="custom-heading heading-3">
  見出しテキスト
</h3>

<h4 class="custom-heading heading-4">
  見出しテキスト
</h4>

<h5 class="custom-heading heading-5">
  見出しテキスト
</h5>

<h6 class="custom-heading heading-6">
  見出しテキスト
</h6>