Convert a screenshot, live URL or Figma frame into pixel-perfect, responsive EtchWP components — ACSS-ready, semantically clean, with smart props and conditional rendering.
EtchWP Pro recreates your design as native Etch elements with a reusable component system — ACSS tokens with safe fallbacks, production-grade BEM, and props so one component serves many pages.
Etch components are real, editable and responsive by construction — mapped to your tokens, structured with BEM, and faithful to the original design down to the breakpoint.
A screenshot, live URL, or a Figma frame.
Nodes become native Etch elements with BEM and props.
Tokens, container queries and BEM grammar are enforced.
Review, then write the component — only on your OK.
The checks that keep generated output coherent, accessible and on-system.
Output is checked against the source for faithful structure.
Tokens mapped with safe fallbacks; BEM grammar enforced.
Reusable props so one component serves many pages.
Parts render only when their data exists.
Container queries instead of clamp() font hacks.
Nothing is persisted until you review and approve.
| Tool | Type | What it does |
|---|---|---|
| nibwp/etchwp-pro-from-design | write | Generate a validated EtchWP component from a design, URL or Figma. |
| nibwp/etchwp-pro-detect | read | Detect the Etch version and global style setup. |
| nibwp/etchwp-pro-list-styles | read | List the available Etch global styles and tokens. |
| nibwp/etchwp-pro-validate | read | Validate a payload against BEM, tokens and anti-patterns. |
| nibwp/etchwp-pro-html-to-component | destructive | Persist the approved component into etch_styles + the post. |
Our landing page came back as real Etch components with props. We reused them everywhere.
Responsive out of the box — no clamp() hacks to clean up.
The BEM and tokens matched our system exactly.
Recommended for token mapping; EtchWP Pro emits safe fallbacks when ACSS is absent.
Yes — output uses smart props and a reusable component system, not one-off markup.
Yes — it uses container queries and a token-driven type ramp, never clamp() hacks.
Yes — EtchWP Pro and the other three Pro Skills are included in the Bundle.
EtchWP Pro is included in the Bundle, or available as a standalone Pro Skill.