SuperAPI AI 工具集

tailwind

前端与建站

查看项目

更新于 10-15 20:06

技能介绍

用途:Tailwind CSSを使う際に、命名や抽象化で思考を止めず、まずutilityで形にしてから必要に応じて抽象化する運用を支援する。設計・レビュー・リファクタリングの判断基準を整理する。

主要能力:基本方針として、再利用したい形が見えた時点でReact/Vue/Svelte等のコンポーネントへ移す。一貫性は色・余白・フォントなどのtokensとコンポーネント境界で統制する。クラス肥大そのものは悪とせず、責務が曖昧な塊になることを問題とする。判断ルールとして、早すぎる抽象化を避け、同じ見た目が3回以上出たら抽象化を検討する。tokensを先に決め、場当たり的な値を増やさない。クラスを読む負担が増えたらCSSの抽象ではなく構造で解決する。

使用方式:最初にデザインシステムの有無、UIの再利用度合い、問題がクラス増殖か見た目の揺れか、実装速度と一貫性の優先度を確認する。出力は推奨方針、理由(認知負荷・一貫性・保守性)、設計案(tokens・コンポーネント境界・クラス整理ルール)、チェックリスト、落とし穴、次アクションの順で提示する。

適用場面:Tailwind CSSを用いたUI実装の設計、コードレビュー、リファクタリング判断。

限制:公式ドキュメント等の詳細は资料に明示がなく、具体的なコマンドやインストール手順は暂未提供。