THE SHORT ANSWER
Pick the build by who edits the site after launch. A page builder like Divi or Elementor suits clients who want to change layouts themselves. ACF with a custom theme suits structured content and tight control. A block theme suits teams that live in the WordPress editor. All three can match a Figma file exactly.
Every Figma to WordPress project starts with the same question from the agency: what should we build it in? The design doesn’t answer that. The client’s team does. Here is how we choose.
01The three ways to build a Figma design
| Build | Best for | Trade-off |
|---|---|---|
| Page builder (Divi 5, Elementor) | Clients who edit layouts and add pages often | Heavier pages if presets aren’t set up well |
| ACF and a custom theme | Structured content, strict brand control, fast pages | Layout changes need a developer |
| Block theme (Gutenberg) | Teams comfortable in the WordPress editor | Complex designs need custom blocks |
02When should you use a page builder?
When the client will build new pages without you. A good builder setup gives them presets and templates so new pages still look on-brand.
- Marketing teams that launch landing pages every month.
- Agencies that already sell Divi or Elementor sites and train clients on them.
- Designs with many one-off sections that change often.
The key is building presets before pages. Set the brand colors, fonts and spacing once as global variables, so a client edit can’t drift off-brand.
03When should you use ACF?
When the content has a fixed shape: team members, case studies, locations, products, events. The client fills in fields and the template handles the design.
- Sites where the brand must look identical on every page.
- Content reused in many places, like a team grid and individual profiles.
- Projects where page speed is the top priority.
FROM OUR DESK
We often mix the two: a page builder for marketing pages and ACF for structured content like case studies. The client gets freedom where it helps and guardrails where it matters.
04When does a block theme make sense?
When the team already writes in the WordPress editor and the design is built from repeatable patterns. Block patterns and theme.json styles keep things consistent, and there is no builder plugin to maintain. Very custom layouts may need custom blocks, which adds development time.
05What does each option cost?
The build method matters less than the number of unique templates in the Figma file. With us, Figma to WordPress builds start at $400 a page, whatever the build method, and most sites are done in 3 to 7 working days.
Have a Figma file ready?
Send it over. We recommend the build method and send a fixed quote within 24 hours.
06A quick way to decide
- Will the client create new page layouts? Use a page builder.
- Is most content structured and repeated? Use ACF.
- Does the team already work in the block editor? Use a block theme.
- Still unsure? Build marketing pages in a builder and structured content with ACF.
07How long each size takes
| Scope | Typical turnaround |
|---|---|
| One landing page | 3 working days |
| Brochure site, 3 to 5 pages | 5 to 7 working days |
| Larger site, 6 to 10 pages | 7 to 10 working days |
| Custom ACF theme or blocks | Quoted per project |
The build method changes the timeline less than the number of unique templates. Ten pages built from three templates go faster than five pages that each look different.
08Prepare the Figma file for handoff
A clean file saves days. These are the things we ask designers to check before the file comes over.
- Colors and text styles saved as named styles or variables, not typed in by hand.
- Auto layout on sections, so spacing rules are clear.
- Desktop and mobile frames for every template, plus tablet for tricky layouts.
- Repeated parts built as components, with their hover and active states.
- Fonts that are licensed for the web, and images exported or ready to export.
NO MOBILE DESIGN?
We can still build it, but someone has to decide how each section stacks. Agree on that before the quote, or it turns into revision rounds later.
09How the design maps to WordPress
| In Figma | Page builder | ACF or blocks |
|---|---|---|
| Color and type styles | Global colors, fonts and design variables | theme.json and CSS variables |
| Components | Presets and global modules | Custom blocks or template parts |
| Auto layout | Flexbox and grid settings | Flexbox and grid in CSS |
| Repeated content, like team members | Loop or dynamic content modules | Custom post types and fields |
Whatever the build, the rule is the same: set the global styles first, then build pages from them. A build that skips this looks right on launch day and drifts off-brand by the third client edit.
10How we check the build matches the design
- Compare each page against the Figma frame at 1440, 1024, 768 and 390 pixels wide.
- Check hover, focus and open states for buttons, menus and accordions.
- Test real content lengths, not just the placeholder copy in the design.
- Run a speed and accessibility check before the agency sees it.
Send us a file and we will tell you which build fits, with a fixed quote. The Figma to WordPress service page has the details.
11FAQ
Can a page builder match a Figma design exactly?
Yes. Divi 5 and Elementor both support flexbox, grid and custom spacing, so a careful build can match the design at every breakpoint.
Is ACF better for SEO than a page builder?
Not by itself. ACF builds are usually lighter, which helps speed. A well set up builder site can rank just as well.
Which option is easiest for clients to edit?
For text and images, ACF fields are the simplest. For changing layouts, a page builder is the easiest.
Do you need a developer to update an ACF site?
For content, no. For new layouts or new field types, yes.
What if the Figma file has no mobile design?
We can build the mobile layout from the desktop design. Agree on how key sections should stack before the quote, so the layout isn’t decided during revisions.
Can you build from Adobe XD or Photoshop files?
Yes. The process is the same. Named styles and clear layers make any file faster to build.
