wallarm

Design System — Design agent for Claude Code

Design community

Use this agent for creating new UI components, modifying existing components, working with Storybook stories, styling with Tailwind CSS and CVA, and design system architecture decisions.\n\nExamples:\.

How to install Design System

Installs to ~/.claude/agents/wallarm-design-system-design-system.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/wallarm/design-system/HEAD/.claude/agents/design-system.md -o ~/.claude/agents/wallarm-design-system-design-system.md

Restart Claude Code, or start a new session, for it to be picked up.

What Design System does


name: design-system description: "Use this agent for creating new UI components, modifying existing components, working with Storybook stories, styling with Tailwind CSS and CVA, and design system architecture decisions.\n\nExamples:\n\n- User: \"Create a new Accordion component\"\n Assistant: \"I'll scaffold the Accordion component with proper structure, types, stories, and exports.\"\n \n\n- User: \"Add a new variant to the Button component\"\n Assistant: \

Alternatives in Design

  • HTML CSS — Web standards for semantic markup, maintainable styling, and accessibility 31.9k ★
  • Tailwind Agent — Styles Rails ERB views and ViewComponents using Tailwind CSS 4 utility classes and responsive design patterns 652 ★
  • Module Debugger — Use this agent to debug module issues — registration failures, route problems, view errors, migration issues 407 ★

Full documentation available on GitHub

View Source Repository