claude

Design System to Skill

Convert an extract-design-system output bundle into a self-contained, auto-triggering per-brand Claude Code skill that later agents use to build pages native to that brand.

23 on GitHubby Nathan Onnv1.0.0MITupdated 2 days agodesign
/

Plugin design-system-to-skill from marketplace nathanonn-agent-skills in nathanonn/agent-skills. Commands read from the repo's manifest — 2 days ago.

What it installs

Skills (1)

  • design-system-to-skill

    Convert an extract-design-system output bundle (a .design_systems/<domain>-YYYYMMDD/ folder with DESIGN.md, AGENTS.md, COMPONENTS.md and DTCG tokens) into a self-contained, auto-triggering per-brand Claude Code agent skill that later agents use to build pages native to that brand. Use whenever the u

View source on GitHub

More from nathanonn/agent-skills

All 16 plugins →

Ask First

claude

Ask clarifying questions before executing tasks. Reaches 95% confidence through structured Q&A, then executes.

1 skill

23

Convert a Node.js CLI tool specification into a Codex /goal-ready bundle with AI-agent-friendly patterns baked in.

1 skill

23

Generate images with the Codex CLI's built-in $imagegen skill, save them into the project, and remove each run's generated_images cache folder so storage stays flat.

1 skill

23

Opens a question dialog when the context window passes a threshold (40% by default) and offers a handoff doc, without blocking background agents.

1 skill

23

Extract a website's design system into a DESIGN.md file (google-labs-code format): colors, typography, spacing, components and brand feel, checked by the official linter.

1 skill

23

Extract a website's tokens and component catalog (variants, states, section patterns) into a bundle a coding agent uses to build pages native to that brand.

1 skill

23

Similar plugins

Collection of example skills demonstrating various capabilities including skill creation, MCP building, visual design, algorithmic art, internal communications, web testing, artifact building, Slack GIFs, and theme styling

19 skills

anthropics/skills 193,780

Comprehensive PR review agents specializing in comments, tests, error handling, type design, code quality, and code simplification

1 command · 6 agents

anthropics/claude-code 155,476

Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.

7 skills

nextlevelbuilder/ui-ux-pro-max-skill 148,759

nextjs

claude

Official Next.js skills: adopt and optimize Cache Components, adopt Partial Prefetching, and verify runtime behavior against a running dev server.

6 skills

vercel/next.js 143,495

Taste Skill

claudecodex

tasteskill 2.5.1: professional company websites at the figma.com and x.ai level, with one section per screen, real photographs, real product UI, effects kept for tech and gaming pages, and a real-browser checker and finish gate.

1 skill

Leonxlnx/taste-skill 114,391

Design fluency for frontend development. 1 skill with 24 commands (/impeccable polish, /impeccable audit, /impeccable critique, etc.) and curated anti-pattern detection.

1 skill · 4 agents · hooks

pbakaus/impeccable 109,099

Maintain Design System to Skill?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex plugins16 plugins