design-system
A design token skill in the UI UX Pro Max repository, credited to claudekit in its metadata.
スキルの内容
A design token skill in the UI UX Pro Max repository, credited to claudekit in its metadata. It has the agent build tokens in three layers (raw primitive values, semantic aliases and component-level variables), turn a JSON token config into CSS with a bundled Node script, check code for hardcoded values with a validator, and write component specs for default, hover, active and disabled states. It also contains a slide system: Python scripts search CSV tables of deck strategies, layouts, typography, colour logic and copy formulas, then the agent writes brand-consistent HTML slides using the tokens and Chart.js and validates them. Another script fetches background images from Pexels or Unsplash.
できること
- Build primitive, semantic and component design token layers
- Generate CSS variables from a JSON token file
- Find hardcoded values that should use tokens
- Create token-based HTML slide decks with Chart.js charts
インストール
プロジェクトのドキュメントに、確認できるインストール手順がありません。 プロジェクトの手順を見る
含まれるファイル
- data/slide-backgrounds.csv
- data/slide-charts.csv
- data/slide-color-logic.csv
- data/slide-copy.csv
- data/slide-layout-logic.csv
- data/slide-layouts.csv
- data/slide-strategies.csv
- data/slide-typography.csv
- references/component-specs.md
- references/component-tokens.md
- references/primitive-tokens.md
- references/semantic-tokens.md
- references/states-and-variants.md
- references/tailwind-integration.md
- references/token-architecture.md
- scripts/embed-tokens.cjs
- scripts/fetch-background.py
- scripts/generate-slide.py
- scripts/generate-tokens.cjs
- scripts/html-token-validator.py
- scripts/search-slides.py
- scripts/slide-token-validator.py
- scripts/slide_search_core.py
- scripts/tests/test_utf8_io.py
- scripts/tests/test_validate_tokens.py
詳細
Next Level Builderのほかの掲載
スキル2件
Next Level Builderの掲載2件をすべて見る →こちらにも掲載： デザイン
出典
- スキルファイル（SKILL.md）github.com/nextlevelbuilder/ui-ux-pro-max-skill · 根拠となる項目：ライセンス2026年11月12日
- ライセンスファイル（LICENSE）github.com/nextlevelbuilder/ui-ux-pro-max-skill · 根拠となる項目：公開元2026年11月12日
- リポジトリ内のフォルダ（design-system）github.com/nextlevelbuilder/ui-ux-pro-max-skill · 根拠となる項目：スクリプトを含む2026年11月12日
- GitHubリポジトリgithub.com/nextlevelbuilder/ui-ux-pro-max-skill · 根拠となる項目：活動状況, ライセンス2026年11月11日
- スキルファイル（SKILL.md）github.com/nextlevelbuilder/ui-ux-pro-max-skill2026年11月10日
- リポジトリ内のフォルダ（design-system）github.com/nextlevelbuilder/ui-ux-pro-max-skill · 根拠となる項目：スクリプトを含む2026年11月10日