jakubkrehel/skills

これは何？

主な機能

• 01アクセシビリティ、レイアウト、文章、タイポグラフィ、色、UIのチェックを1つのレビューにまとめます。
• 02WCAG 2.2に照らして、キーボード操作、フォーカス、ARIA、フォームをチェックします。
• 03カラーパレットを生成し、セマンティックトークンに名前を付け、コントラストを測定します。
• 04既存のプロジェクトのトークンやコンポーネントを使い、Figmaファイルやデザイン画像からUIを構築します。
• 05一時的なページ上でコンポーネントをさまざまな状態でレンダリングし、負荷をかけてテストできます。

ユースケース

• マージ前にプルリクエストをレビューし、インターフェースのリグレッションを見つける。
• 既存アプリのキーボード操作やスクリーンリーダーに関する問題を監査する。
• セマンティックトークンとコントラストチェックを備えたカラーシステムを構築する。
• Figmaのデザインをデザインシステムに沿ったコードに変換する。

クイックスタート

1. 1

   skillsコレクションをインストールする

   npx skills add jakubkrehel/skills
2. 2

   または、Claude Codeのプラグインマーケットプレイスを追加する

   /plugin marketplace add jakubkrehel/skills
3. 3

   その後、プラグインをインストールする

   /plugin install interfaces@interfaces

使う前に知っておきたいこと

• !Markdown形式のエージェントスキルで構成されているため、利用するには互換性のあるAIコーディングエージェントが必要です。

トピック

よくある質問

skills とは？

アクセシビリティ、レイアウト、タイポグラフィ、色、文章、UIの仕上げを網羅するエージェントスキル集。 このリポジトリは、AIコーディングエージェントが読み込んでインターフェース作業の質を高められる、再利用可能な指示パックであるエージェントスキル集です。アクセシビリティ、レイアウト、タイポグラフィ、色、UI文言、UIの仕上げを扱い、各スキルを単独で使うことも、1つのレビュー用スキルから組み合わせて使うこともできます。

skills は無料で使えますか？ライセンスは？

skills は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

skills は今もメンテナンスされていますか？

活発にメンテナンス中。skills の最終コミットは 2026年10月13日 です。

skills は何に使えますか？

マージ前にプルリクエストをレビューし、インターフェースのリグレッションを見つける。 既存アプリのキーボード操作やスクリーンリーダーに関する問題を監査する。 セマンティックトークンとコントラストチェックを備えたカラーシステムを構築する。 Figmaのデザインをデザインシステムに沿ったコードに変換する。

skills のインストール方法は？

skillsコレクションをインストールする: npx skills add jakubkrehel/skills または、Claude Codeのプラグインマーケットプレイスを追加する: /plugin marketplace add jakubkrehel/skills その後、プラグインをインストールする: /plugin install interfaces@interfaces

skills はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/jakubkrehel/skills