Baseline UI

AI が生成したインターフェイスの品質低下を防ぐため、設計思想に基づく UI ベースラインを強制します。

使い方

• /baseline-ui このトークンで以降の UI 作業にこれらの制約を適用します。

• /baseline-ui <file> ファイルをすべての制約に照らして確認し、以下を出力します:

  • 違反箇所 (正確な行またはコードを引用)
  • その理由 (1 文で簡潔に)
  • 具体的な修正案 (コードレベルの提案)

スタック

• MUST: カスタム値が既に存在するか明示的に指定されていない限り、Tailwind CSS のデフォルト値を使用すること
• MUST: JavaScript アニメーションが必要な場合は motion/react (旧 framer-motion) を使用すること
• SHOULD: Tailwind CSS のエントランスアニメーションとマイクロアニメーションには tw-animate-css を使用すること
• MUST: クラスロジックに cn ユーティリティ (clsx + tailwind-merge) を使用すること

コンポーネント

• MUST: キーボードまたはフォーカス動作を持つ要素には、アクセシビリティ対応

...