カラーパレット Skill
プロンプトからWebサイト向けのプロフェッショナルなカラーパレットを生成します。スキルはプロンプト優先で、ムードやテーマ、ベースカラーを記述すると、アンカーカラーを抽出し、調和スキームを選び、ニュートラルの階調を構築し、UI向けのロールトークンを割り当てます。デフォルトでは3つの候補を返し、コンソールプレビューを表示します。コントラストチェックは要求された場合のみ実行されます。
GitHub リポジトリスクリプトと参照資料はリポジトリにあります。
概要
このツールはWeb UIのパレット探索に焦点を当て、primary、secondary、accent、background、surface、text、muted、border のロール用に構造化されたトークンを提供します。
ワークフロー
- ムード、テーマ、またはベースカラーを説明するプロンプトを提供します。
- 2〜3色のアンカーカラーを抽出し、調和スキームを選びます。
- background、surface、text、muted、border 用のニュートラル階調を作成します。
- primary、secondary、accent、サポートトークンの役割を割り当てます。
- 同梱スクリプトでコンソールプレビューを表示します。
Output
Output is kept in memory as JSON tokens, then a console preview renders the palettes with hex values. By default, it does not write files and it returns three palette options.
#1 Tropical Pop - Fresh tropical for the current site; lively and clean.
primaryLagoon Teal#16B6A4
secondarySunflare Sand#F2C56B
accentCoral Punch#FF6A5E
backgroundCloud Foam#F2FBF8
surfaceMist Glass#EAF7F2
textInk Tide#1C2B2A
mutedSea Fog#8FA8A3
borderDrift Line#D6E7E1
#2 Cream Studio - Creamy minimal with warm neutrals and a soft accent.
primaryEspresso Slate#3E3435
secondaryOat Linen#D9C9B7
accentCinnamon Clay#C56A4A
backgroundWarm Porcelain#FAF7F2
surfaceSoft Paper#F1ECE5
textDeep Roast#2F2524
mutedMellow Taupe#9A8B84
borderParchment Edge#E0D7CF
#3 Playful Signal - Playful modern with bold primaries and airy neutrals.
primaryPixel Blue#3B6CFF
secondaryLime Kick#8DEB3A
accentMagenta Pop#FF4FA3
backgroundIce Violet#F7F8FF
surfaceSoft Pixel#EEF0FF
textNight Ink#141C2A
mutedClouded Steel#9AA6C0
borderLight Frame#D6DDF2
オプションと範囲
任意
- リクエスト時にコントラストチェック（AA または AAA）。
- リクエスト時に CSS 変数または Tailwind 形式で出力。
対象外
- UI または CSS フレームワークの実装は行いません。
- 外部 API の呼び出しは行いません。