付録D 用語集
本書で登場した重要語をまとめます。詳しくは各章を参照してください。
- ユーティリティクラス: 単一の役割だけを持つ小さなクラス(
p-4・bg-whiteなど)。これを組み合わせてデザインする(第3章)。 - Utility First(ユーティリティファースト): ユーティリティクラスの組み合わせで UI を作る設計思想(第3章)。
- バリアント: ユーティリティに条件を付ける接頭辞(
hover:・md:・dark:など)。CSS のセレクタやメディアクエリを生成する(第6章)。 - 任意の値(arbitrary value): 角かっこでスケール外の値を直接書く記法(
p-[13px])。便利だが乱用は一貫性を崩す(第4章・第27章)。 - テーマ変数 / デザイントークン:
@themeで定義する、色・余白などの「デザイン上の決め事」。CSS 変数とユーティリティ生成を兼ねる(第5章)。 - セマンティックトークン: 役割を表す色名などのトークン(
--color-primaryなど)。ダークモードや配色変更に強い(第12章・第26章)。 @theme: テーマ変数を定義する v4 のディレクティブ(第5章)。@apply: ユーティリティを自前の CSS クラスに展開するディレクティブ。多用は非推奨(第22章)。@utility: 単機能のカスタムユーティリティを追加する v4 のディレクティブ(第22章・第26章)。@plugin: JS ベースのプラグイン(typography/forms など)を CSS から読み込む互換ディレクティブ(第26章)。@source: クラス走査の対象を明示的に追加/除外するディレクティブ(第4章・第26章)。@custom-variant: 独自のバリアントを定義するディレクティブ。手動ダークモードにも使う(第6章・第18章)。- JIT(Just-In-Time): 使われているクラスだけをその場で生成する仕組み(第4章)。
- Oxide: v4 の新エンジンのコードネーム。性能重視部分は Rust 製(第4章・第29章)。
- Lightning CSS: v4 が内蔵する Rust 製の CSS 処理ツール(パース・プレフィックス・圧縮など)(第4章・第29章)。
- カスケードレイヤー(
@layer): レイヤーの優先順位で詳細度の戦いを制御するモダン CSS 機能(第4章)。 - コンテナクエリ(container query): 画面ではなく親要素の幅に反応するレイアウト(
@container/@md:)(第14章・第17章)。 - Preflight: Tailwind が当てる土台のリセット CSS(第4章)。
cn:clsx(条件分岐)とtailwind-merge(衝突解消)を組み合わせた定番ヘルパー(第23章)。- CVA(Class Variance Authority): 型安全にバリアントを管理するライブラリ(第23章)。
- モバイルファースト: 無印が全画面に効き、
md:などで広い画面を上書きする設計(第17章)。 - FOUC: ダークモード初期表示などで起きる一瞬のちらつき(第18章)。