By skobak
Autonomously generate pixel-perfect frontend UIs from Figma design links. Input a Figma URL to trigger implementation using node metadata, screenshots, design tokens, and Chrome rendering verification for automatic refinement into HTML, CSS, and JavaScript code.
npx claudepluginhub skobak/pixBuild frontend on autopilot. Pixel-perfect Figma-to-code with autonomous refinement.
claude plugin install github:skobak/pix
Or manually:
git clone https://github.com/skobak/pix.git ~/.claude/plugins/pix
Start Claude Code with Chrome integration:
claude --dangerously-skip-permissions --chrome
Then run:
/pix
Run /pix — checks your Figma MCP and Chrome extension setup, guides you if anything is missing
Auto-launch — starts your dev server, opens localhost in Chrome, asks you to paste the Figma link (Figma MCP handles screenshots directly)
Sit back — watch it extract tokens, implement the component, screenshot both views, compare pixel-by-pixel, and auto-fix until perfect
| Tool | Purpose |
|---|---|
whoami | Verify authentication |
get_metadata | Component structure |
get_design_context | Full design spec |
get_variable_defs | Design tokens |
get_code_connect_map | Existing component mappings |
get_screenshot | Figma reference image |
--chrome flagMIT
Standalone image generation plugin using Nano Banana MCP server. Generates and edits images, icons, diagrams, patterns, and visual assets via Gemini image models. No Gemini CLI dependency required.
Ultra-compressed communication mode. Cuts ~75% of tokens while keeping full technical accuracy by speaking like a caveman.
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Humanise text and remove AI writing patterns. Detects and fixes 24 AI tell-tales including inflated language, promotional tone, AI vocabulary, filler phrases, sycophantic tone, and formulaic structure.
Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). Proactively activates in projects with cacheComponents: true, providing patterns for 'use cache' directive, cacheLife(), cacheTag(), cache invalidation, and parameter permutation rendering.
Frontend design skill for UI/UX implementation