Dev.to AI 🤖 Ai 👁 0

From a Figma URL to a custom WordPress theme with Claude Code

I built figma-wp-blueprint, a set of Claude Code skills for turning a Figma design into a custom WordPress theme. Paste a Figma URL and it: extracts colors, fonts, spacing, and breakpoints builds each section as an AC

I built figma-wp-blueprint, a set of Claude Code skills for turning a Figma design into a custom WordPress theme.

Paste a Figma URL and it:

  • extracts colors, fonts, spacing, and breakpoints
  • builds each section as an ACF Flexible Content layout (fields, PHP template, scoped CSS)
  • measures the result against Figma at every breakpoint with /pixel-check
  • works one feature at a time, on its own Git branch, and asks for your approval before committing

The result is a classic PHP theme with pure CSS and vanilla JS: no page builder, no jQuery, no build step.

🌐 https://figma-wp-blueprint.vercel.app/
⭐ https://github.com/saidMounaim/figma-wp-blueprint

Feedback welcome!

📰 Read the original article on Dev.to AI

Originally published by Dev.to AI. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.