Stats
Actions
Tags
From ralph-starter
Extracts Figma designs into production code for React, Vue, Svelte, Astro, Next.js, Nuxt, or HTML using ralph-fetch-spec and ralph-run tools.
How this skill is triggered — by the user, by Claude, or both
Slash command
/ralph-starter:ralph-figmaThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Extract a Figma design and build it as production code.
Extract a Figma design and build it as production code.
ralph_fetch_spec with source: "figma" and the Figma file URL as identifier
spec (full design spec), tokens (CSS/Tailwind design tokens), components (component code), content (text/IA), assets (icons/images)ralph_run to build the implementation:
from: "figma" to fetch directly from the Figma sourceSupported frameworks: React, Vue, Svelte, Astro, Next.js, Nuxt, HTML.
npx claudepluginhub multivmlabs/ralph-starter --plugin ralph-starterGenerates React, Vue, or HTML code from Figma designs using Anima SDK. Supports TypeScript, Tailwind CSS, and shadcn/ui. Outputs files for components.
Generates production-ready React, Vue, or HTML/CSS code from Figma components or frames via Figma MCP server with Code Connect support. For design-to-code workflows.
Provides behavioral guidelines to reduce common LLM coding mistakes, focusing on simplicity, surgical changes, assumption surfacing, and verifiable success criteria.