mantacron

UI Component Writer — Design agent for Claude Code

Design community

Converts design inputs (screenshots, Figma exports, wireframe images, or text descriptions) into production-ready UI components that match the project's existing design system, naming conventions, and.

How to install UI Component Writer

Installs to ~/.claude/agents/mantacron-manta-ui-component-writer.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/mantacron/manta/HEAD/.claude/agents/ui-component-writer.md -o ~/.claude/agents/mantacron-manta-ui-component-writer.md

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

What UI Component Writer does


name: ui-component-writer description: Converts design inputs (screenshots, Figma exports, wireframe images, or text descriptions) into production-ready UI components that match the project's existing design system, naming conventions, and framework. Detects component libraries (shadcn/ui, MUI, Chakra, Ant Design), icon libraries, dark mode strategy, animation libraries, and form/empty/skeleton states. Reads PATTERNS.md and samples up to 3 existing components to infer conventions. Generates

Alternatives in Design

  • Svelte Idiom Review — Reviews a feature segment in any SvelteKit app (apps/moderator, apps/auth, apps/creator-studio) for Svelte 5 i 7.2k ★
  • Frame Describer — Describes video frames as detailed text 1.3k ★
  • Clean Code — Clean code principles reference 538 ★

Full documentation available on GitHub

View Source Repository