1. Typography / 文字表示
見出し H1：日本語 ABC 123
見出し H2：日本語 ABC 123
見出し H3：日本語 ABC 123
通常テキストです。ひらがな、カタカナ、漢字、English、1234567890、 記号（！？＠＃％＆）を含みます。
小さい文字 12px / Small text
大きい文字 24px / Large text
補足・薄い文字の表示確認
太字 / 斜体 / 下線 / リンク表示
2. Colors / 色
Primary
Success
Warning
Danger
Dark
3. Buttons / ボタン
4. Form / フォーム
5. Cards / カード
NEW
カード A
短い説明文。カード幅や余白の確認用です。
INFO
カード B
少し長めの文章を入れています。文章量が増えたときの高さや折り返しを確認できます。
カード C
inline code の表示も確認できます。
6. Table / テーブル
| ID | 名前 | ステータス | 更新日 | 備考 |
|---|---|---|---|---|
| 001 | テストデータA | 完了 | 2026-08-21 | 正常表示 |
| 002 | テストデータB | 対応中 | 2026-08-20 | 長めのテキストが入った場合の表示確認用データです。 |
7. Overflow / 長文・はみ出し確認
LONG_STRING_TEST_ABCDEFGHIJKLMNOPQRSTUVWXYZ_0123456789_ABCDEFGHIJKLMNOPQRSTUVWXYZ_0123456789
URLや連続した英数字など、折り返されにくい文字列による横スクロール確認用です。
8. Image / 画像領域
9. Responsive / レスポンシブ確認
ブラウザ幅を600px以下にすると、余白やカードレイアウトがスマートフォン向けに変化します。