HagiCode

HagiTrait

Searchable agent catalog · Multilingual detail pages · Shareable canonical links.

Canonical agents

325

Languages

7

Sources

5

Agent types

103

Essential traits of high-performance agents

Browse reliable agent descriptions collected from the internet and validated extensively.

Enter Gallery

iannuttall/claude-agents

Frontend Designer

Use this agent when you need to convert design mockups, wireframes, or visual concepts into detailed technical specifications and implementation guides for frontend development. This includes analyzing UI/UX designs, creating design systems, generating component architectures, and producing comprehensive documentation that developers can use to build pixel-perfect interfaces. Examples:\n\n<example>\nContext: User has a Figma mockup of a dashboard and needs to implement it in React\nuser: "I have this dashboard design from our designer, can you help me figure out how to build it?"\nassistant: "I'll use the frontend-design-architect agent to analyze your design and create a comprehensive implementation guide."\n<commentary>\nSince the user needs to convert a design into code architecture, use the frontend-design-architect agent to analyze the mockup and generate technical specifications.\n</commentary>\n</example>\n\n<example>\nContext: User wants to establish a design system from existing UI screenshots\nuser: "Here are screenshots of our current app. We need to extract a consistent design system from these."\nassistant: "Let me use the frontend-design-architect agent to analyze these screenshots and create a design system specification."\n<commentary>\nThe user needs design system extraction and documentation, which is exactly what the frontend-design-architect agent specializes in.\n</commentary>\n</example>\n\n<example>\nContext: User needs to convert a wireframe into component specifications\nuser: "I sketched out this user profile page layout. How should I structure the components?"\nassistant: "I'll use the frontend-design-architect agent to analyze your wireframe and create a detailed component architecture."\n<commentary>\nThe user needs component architecture planning from a design, which requires the frontend-design-architect agent's expertise.\n</commentary>\n</example>

en
Frontend Designer

Sources

Tracked sources

5 Sources

everything-claude-code

affaan-m/everything-claude-code

Agent Markdown FlatFlat

agents/*.md

Open source

Canonical agents

28

Languages

7

Stars

161,475

Last synced

4/20/2026

28/28

0xfurai/claude-code-subagents

0xfurai/claude-code-subagents

Agent Markdown FlatFlat

agents/*.md

Open source

Canonical agents

138

Languages

1

Stars

835

Last synced

4/20/2026

138/138

VoltAgent/awesome-claude-code-subagents

VoltAgent/awesome-claude-code-subagents

Agent Markdown RecursiveRecursive

categories/**/*.md

Open source

Canonical agents

134

Languages

1

Stars

17,754

Last synced

4/20/2026

134/134

iannuttall/claude-agents

iannuttall/claude-agents

Agent Markdown FlatFlat

agents/*.md

Open source

Canonical agents

7

Languages

1

Stars

2,045

Last synced

4/20/2026

7/7

get-shit-done

gsd-build/get-shit-done

Agent Markdown FlatFlat

agents/*.md

Open source

Canonical agents

18

Languages

1

Stars

55,101

Last synced

4/20/2026

18/18