claude

21st

21st.dev UI skills and MCP. Pinned upstream: 21st-dev/claude-code-plugin.

0 on GitHubby 21st.devv0.4.1Apache-2.0updated 4 days agodesign
/

Plugin 21st from marketplace ogfrench in ogfrench/claude-code-setup. Commands read from the repo's manifest — 4 days ago.

What it installs

Skills (7)

  • 21st-ai

    Generate and iterate on UI with 21st AI from the terminal via the `21st` CLI (`@21st-dev/cli`): sketch a UI from a prompt, preview the variants in the browser, edit any variant in place with a natural-language change, and pull the final code into the project. Use whenever the user wants to BUILD / S

  • 21st-cli-use

    Search, install and pull code from the 21st.dev catalog with the `21st` CLI (`@21st-dev/cli`): find React/shadcn components, themes and templates, print a component's code or a theme's CSS, install an item into the project, or generate a new component with 21st AI. Use whenever the user says "search

  • 21st-design-sync

    Look at the current project's design (its shadcn / Tailwind CSS variables and color tokens) and publish it to the 21st.dev community as a shareable theme, using `21st publish-theme`. Use when the user says "publish my theme", "share our design as a 21st theme", "sync my design to 21st", "turn my glo

  • 21st-registry

    Publish your own work to 21st.dev and manage it from the terminal with the `21st` CLI (`@21st-dev/cli`): publish a React component to a team library, publish a CSS theme or a template listing, edit / unpublish / delete your published items, list and reopen existing component work, and read/replace y

  • 21st-ui-build

    Build or substantially change production UI using the current project's design context, existing components, and grounded 21st inspiration. Use when implementing a page, section, component, responsive redesign, or visual polish in an existing web project. Trigger for requests such as "build this UI"

  • 21st-ui-explore

    Explore and compare multiple meaningfully different UI directions grounded in the current project's design system and 21st inspiration. Use when the user wants options, variants, concepts, a redesign direction, visual experimentation, or is unsure how a new interface should look. Trigger for request

  • 21st-ui-review

    Review existing UI against the project's design context, accessibility expectations, responsive behavior, interaction quality, and high-confidence production rules. Use for UI audits, design QA, frontend review, accessibility review, consistency checks, or requests to find and safely fix visual defe

MCP servers (1)

  • 21st

    connects to: https://21st.dev/api/mcp

View source on GitHub 21st.dev

More from ogfrench/claude-code-setup

All 4 plugins →

How work is run: best-practices, learning-loop, model-delegation, visual-loop, token-efficiency, actions-cost, netlify-cost, session-continuity, knowledge-base-builder, plugin-experience-design, and the cheap-reviewer subagent.

11 skills · 1 agent

0

Brand-neutral presentation storytelling, deck creation, design-system application and visual restraint.

4 skills

0

Writing skills: frogify (frog voice), deslopify (copy audit), humanizer (remove AI tells).

3 skills

0

Similar plugins

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

diagram-design

claudecodex

Editorial diagrams in your brand, as self-contained HTML and SVG. Architecture, flowcharts, sequence, state machines, ER and database schemas, timelines, swimlanes, org charts, Gantt, Wardley maps, user journeys, service blueprints, UML class, lifecycle phase maps, and charts from bar, line and scatter to Sankey, treemap and heatmap, plus many more. Redraws draw.io, Mermaid, Excalidraw and PlantUML files. Exports SVG and PNG.

1 skill · 7 commands

cathrynlavery/diagram-design 66,757

daisyui

claudecodex

daisyUI component library skill

7 skills

saadeghi/daisyui 42,821

Backend API design, GraphQL architecture, workflow orchestration with Temporal, and test-driven backend development

9 skills · 1 command · 8 agents

wshobson/agents 42,461

Zero-dependency HTML presentation generator with safe presets, bold template-library styles, PPT conversion, and anti-AI-slop design philosophy.

1 skill

zarazhangrui/frontend-slides 32,274

Maintain 21st?

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 plugins4 plugins