Components

“ここぞ”の注意喚起。多用は品位を損ねるので限定利用向き。

主張しすぎない背景のループ。LPの品位を支える。

カード/ボタンに“触れた感”を付ける。transform衝突を避けるmk-transformも同梱。

CTAを“吸い付く”ように。強さは控えめが上品。

タグ型チップで絞り込みを行うUI。

機能差分を表形式で見せる比較表。

実績/統計の数値をスクロール時にカウントアップ。

ページ末尾で次の行動を促すバナー。

データ行を並べ、ステータスをバッジで添える。

空状態から次の行動へ導くオンボーディング。

質問と回答を折りたたみで整理するFAQセクション。

機能説明をカードで整理するグリッド。

ドラッグ＆ドロップにも対応しやすいアップロード枠。

リンクとコピーライトを整えるシンプルなフッター。

問い合わせなどの基本フォームセット。

検索と絞り込みをまとめたフィルタバー。

中央揃えでメッセージを強調するシンプルなヒーロー。

左右2カラムで訴求とビジュアルを分ける定番ヒーロー。

提携先ロゴを滑らかに流すロゴクラウド。

成功/警告/危険などの状態をひと目で伝える通知枠。

ユーザー画像やイニシャルを丸く整える。

状態やラベルを短く伝える小さなタグ。

ページの上部で重要なお知らせを広く伝える。

現在地を静かに示すパンくず。

主要アクションを伝えるボタンセット。

情報をまとまりで見せるカード。

チェックボックスを視認性よく整える。

フィルタやタグを軽く選択できるチップ。

FAQ向けの折りたたみ。JS版推奨（内容高さが安定）。

Modal / Drawer / Bottom sheet を同じ作法で扱う。

メニューや行動をまとめるドロップダウン。

データがない時に次の行動を示す。

ファイル選択をわかりやすくするアップローダ。

フォーム入力の基礎。単体/グループを整える。

箇条書きを整え、要点を見せる。

“待ち”を気持ち良くする小物セット。