Rylaa Claude Agent Workflows
- 2 repo stars
- Rylaa/claude-agent-workflows
rylaa-claude-agent-workflows is a Claude Code plugin collection that runs Figma-to-code, Next.js frontend, and structured code-review workflows.
About
rylaa-claude-agent-workflows packages the Pixelbyte plugin set for developers who ship polished web UIs with Claude as a senior frontend partner. You choose among three plugins rather than swallowing a monolith—typically a Figma-to-code path, a frontend development accelerator, and a code review workflow aligned with component guidelines and Suspense-ready Next.js patterns. The README positions the bundle for design-to-production loops: extract tokens, generate React TypeScript with Tailwind and shadcn/ui, then validate accessibility and performance. founders validating a landing page or SaaS dashboard benefit most when Figma is the source of truth and they want agent steps that mirror agency-style 5-phase delivery. Complexity sits at intermediate because you must align Figma structure, router conventions, and review expectations. It complements generic coding agents by narrowing scope to visual fidelity and frontend compliance rather than backend or DevOps.
- Collection of 3 specialized Claude Code plugins you install à la carte
- Figma-to-code conversion with pixel-perfect and design-token oriented workflows
- Next.js App Router, React TypeScript, Tailwind, and shadcn/ui oriented generation
- 5-phase workflow coverage spanning design extraction through validation
- Accessibility, performance, and visual accuracy checks for senior-level frontend review
Rylaa Claude Agent Workflows by the numbers
- Data as of Jul 7, 2026 (Skillselion catalog sync)
/plugin install rylaa-claude-agent-workflows@Rylaa/claude-agent-workflowsAdd your badge
Show developers this plugin is listed on Skillselion. Paste this into your README.
| repo stars | ★ 2 |
|---|---|
| Repository | Rylaa/claude-agent-workflows ↗ |
What it does
Install Pixelbyte plugins to turn Figma designs into Next.js + shadcn/ui code and run structured frontend code review.
Who is it for?
Best when you use Figma, Next.js, Tailwind, and shadcn/ui and want modular workflow plugins.
Skip if: Backend-only APIs, mobile-native stacks, or teams with no Figma source designs.
What you get
After installing the relevant Pixelbyte plugins, you get guided design extraction, component generation, and validation passes without rebuilding prompts each sprint.
- Up to three installable workflow plugins tailored to design conversion, frontend build, and review
- Generated React TypeScript UI aligned with Tailwind and shadcn/ui patterns
- Review-oriented passes covering accessibility, performance, and visual accuracy
By the numbers
- Plugin count: 3
- Source repository: Rylaa/claude-agent-workflows
- Documented 5-phase workflow coverage in plugin keywords
Recommended Plugins
0xdesign Design PluginDesign exploration plugins for Claude Code743
Adlsdztony Claude Marketplace1 plugin2
Alexanderop Claude Skill Vue DevelopmentA Claude Code Agent Skill for Vue.js development with TypeScript, emphasizing testing-first development, functional patterns, and maintainable architecture.27
Alonw0 Web Asset GeneratorClaude skill to generate favicons, app icons, and social media images from logos, text, or emojis.469
Ankish8 Storybook NpmLocal plugins for myOperator UI2
Antvis Chart Visualization Skills⛏️ Turning data into a visual language for better thinking with Skills.446How it compares
Curated multi-plugin frontend workflow pack, not a single MCP server or generic project template.
FAQ
Who is Rylaa Claude Agent Workflows for?
Frontend-focused developers and pixel-conscious teams converting Figma designs to Next.js with agent-assisted review.
When should I use Rylaa Claude Agent Workflows?
Use it during UI build sprints when you have Figma specs and want figmatocode, component generation, and review plugins installed selectively.
How do I add Rylaa Claude Agent Workflows to my agent?
Open the Rylaa/claude-agent-workflows repository, install only the Pixelbyte plugins you need into Claude Code, and follow each plugin’s workflow for design extraction, codegen, and review.