Communitygithub.com

rhino-ty/apca-contrast-skill

AIエージェントスキル:APCA-W3 v0.1.9 知覚コントラスト測定、fontLookupAPCA 合格/不合格 — Tailwind v4 / shadcn oklch トークン、ライト/ダークモードのデザインシステム監査を実現

apca-contrast-skill とは?

このスキルは、APCA-W3(Accessible Perceptual Contrast Algorithm)v0.1.9 を用いて、UI デザインにおける前景色と背景色のコントラスト比を人間の知覚に基づいて評価します。単なる数値チェックではなく、フォントサイズとウェイトに応じた `fontLookupAPCA` による合格/不合格判定を行い、WCAG よりも精度の高いアクセシビリティ監査を可能にします。主に Tailwind v4 や shadcn/ui で採用される oklch カラートークンを受け入れ、ライトモードとダークモードの両方でコントラスト値を計算・比較することで、テーマ切り替え時の可読性問題を早期に発見できます。開発者やデザイナーは、このスキルを AI エージェント(Claude Code, Cursor, Codex 等)に組み込み、デザインシステムの一貫性を保ちながらアクセシビリティ基準を満たす UI を効率的に構築できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add rhino-ty/apca-contrast-skill

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

apca-contrast-skill は何をしますか?

AIエージェントスキル:APCA-W3 v0.1.9 知覚コントラスト測定、fontLookupAPCA 合格/不合格 — Tailwind v4 / shadcn oklch トークン、ライト/ダークモードのデザインシステム監査を実現

関連スキル