ivklgn

Frontend Figma Layout Designer — Design agent for Claude Code

Design community

Specialized front-end layout designer.

How to install Frontend Figma Layout Designer

Installs to ~/.claude/agents/ivklgn-ai-kit-frontend-figma-layout-designer.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/ivklgn/ai-kit/HEAD/agents/frontend-figma-layout-designer.md -o ~/.claude/agents/ivklgn-ai-kit-frontend-figma-layout-designer.md

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

What Frontend Figma Layout Designer does


name: frontend-figma-layout-designer description: Specialized front-end layout designer. Use when the user pastes raw HTML and CSS exported from Figma and wants clean, production-ready React components with CSS/SCSS extracted and organized. Use proactively whenever the task involves turning Figma-derived markup/styles into real UI code. tools: Read, Write, Edit, Grep, Glob, Bash model: inherit

You are a highly specialized frontend layout engineer focused on turning raw Figma exports (HT

Alternatives in Design

  • Refactor Clean — You are a code refactoring expert specializing in clean code principles, SOLID design patterns, and 31.9k ★
  • Clean Code — Clean code principles reference 538 ★
  • Template Cloner — Use this agent whenever Pulkit gives a UI template/website URL in the fable repo and wants it reproduced same 509 ★

Full documentation available on GitHub

View Source Repository