color-math-accessibility について
アクセシブルで再現可能なUIの色選びに、色彩数学を活用するためのリファレンススキルです。コントラスト、パレット、知覚的な明度、不透明度、ブレンドを、ルールや例、監査ワークフローで扱います。
主な機能
- 01タスクに応じた資料選択ガイド
- 02色彩システムのルールと例外
- 03例とリファクタリングの指針
- 04再利用可能な数式とパターン
- 05段階的な色彩監査
活用シーン
- 01UIの色コントラスト確認
- 02パレット内の色の関係の導出
- 03不透明度やブレンド結果のデバッグ
- 04チェックリストによる色彩システムのレビュー
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/color-math-accessibilityを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
guidelines.mdagents/openai.yamlreferences/source-map.mdreferences/color-systems/checklist.mdexamples.mdknowledge.mdpatterns.mdrules.mdworkflows/audit-color-system.md詳細
色彩計算のアクセシビリティ
色の説明可能性、アクセシビリティ、再現性が求められる場合に、このスキルを使用します。コントラスト、パレットの関係、知覚的な明度、不透明度、ブレンドなど、実際の UI の結果に影響する色の計算に焦点を当てています。
クイックスタート
guidelines.mdを読み、関連性の高い最小限のファイルを選択します。- 実装上の判断には、
references/color-systems/rules.mdを読み込みます。 - コードを編集する際は、
references/color-systems/examples.mdを読み込みます。 - 複数の手順を伴う導出やデバッグには、
workflows/audit-color-system.mdを使用します。
内容
| リソース | 用途 |
|---|---|
guidelines.md | タスクに適したリファレンスファイルを案内します |
references/source-map.md | 書籍の出典と章・節の対応関係 |
references/color-systems/knowledge.md | 基本概念と用語 |
references/color-systems/rules.md | 実践的なルール、ガイドライン、例外 |
references/color-systems/examples.md | 適切でない例・適切な例とリファクタリングの手法 |
references/color-systems/patterns.md | 再利用可能な数式と実装パターン |
references/color-systems/checklist.md | レビューチェックリストと注意すべき点 |
workflows/audit-color-system.md | ステップごとのワークフロー |
出典
Paul McFedries 著 Math for Web Design 第 7 章「The mathematics of color」に基づいています。
引用の参照先は references/source-map.md に記録されています。
コメント
Markdown 対応