Push a Figma frame straight into WordPress as a real page — no screenshots, no manual rebuilding. The importer reads your frame’s layout, text, colors and images and compiles them with a deterministic engine, so the same design always imports the same way.
Where: WP Admin → Tiger Elements → Figma Importer (Beta). Tier: Pro.
Setup (3 steps)
- Install the Tiger Elements plugin inside Figma (in Figma: Plugins → Development → Import from manifest).
- Copy the REST Endpoint and generate an Access Token on this settings page, and paste both into the Figma plugin. The token is minted by your site (it’s not a Figma API key), tied to your account, and shown only once — so anything you import becomes your draft. Use Copy or Revoke to manage the connection; generating a new token replaces the old one.
- In Figma, select a frame and push it to WordPress.
Imports run as a background job and return immediately, so large or image-heavy frames don’t time out.
Two destinations
You choose how the frame lands:
- Elementor page — a real, drag-editable Elementor page. Best when you want to keep refining the design in the builder afterward.
- Native (pixel-perfect) page — an exact HTML/CSS reproduction edited as content. Best when fidelity matters more than drag-editing.
What gets converted
Images are sideloaded into your Media Library; the flat Figma frame is rebuilt into a proper structure (sections, columns, grids, cards); and Tiger recognizes common clusters — a group that looks like pricing, testimonials, or a hero — and upgrades them into the matching editable Tiger widgets. You can steer this by naming layers with a tiger:<type> or #<type> tag, or by using the Layer Mapping panel. A built-in quality check tidies obviously safe issues without ever blocking the import.
Deterministic, not AI
The importer is deterministic only — there is no AI upgrade pass. A content-conservation gate compares the layout before and after any cluster upgrade on text and color, and reverts to the exact deterministic result if anything drifts, so your imported content is never altered. If you want AI to help rebuild a messy design, that’s a separate route through the Build with AI connection (Figma Dev Mode plus Tiger’s MCP), not this importer.
Accuracy & best practices
Any design imports, but Tiger-ready files import far better (roughly 90%+ accuracy); messy, flat, or scraped-from-web files get best-effort structure. For the cleanest result:
- Design with Auto Layout; use one frame per page or section.
- Make the section background the frame’s own fill, not a floating rectangle.
- Build cards as equal-sized frames inside a grid frame; use real text layers on a consistent type scale.
- Make buttons components, keep images as single fills, and group decorative vectors so they don’t explode into fragments.
Troubleshooting
The Figma plugin can’t connect.
Re-copy the REST Endpoint and generate a fresh Access Token (it’s shown only once). The importer is a Pro feature, so confirm your Tiger Elements Pro license is active.
My import came in only partially.
Very large selections can be truncated by the Figma plugin — import one frame or section at a time. Messy or ungrouped layers also reduce accuracy; tidy the frame using the best practices above and re-push.