Figma to Webflow (HTML, CSS and Website)
Design in Figma, Launch in Webflow
Plugin Preview
About this plugin
About
Export Figma to HTML and CSS with Webflow
Transform your static designs into a production-ready site with Webflow. Sync your design system — components, variables, and styles — to give your team the power to launch sophisticated sites quickly.
Getting started
1. Install and connect
- Install the Figma to Webflow plugin
- Authorize your Webflow Workspaces or sites
2. Sync layers, variables, or styles
- Export Figma layers to Webflow components and elements
- Export Figma variables to Webflow variables
- Export Figma text and effect styles to Webflow classes
- Copy/paste Figma layers as elements in Webflow
3. Import in Webflow
- Click "Continue in Webflow" or open your site
- Open the Figma to Webflow app (installed automatically)
- Import your layers, variables, or styles
4. Polish and publish
- Bring your static designs to life with Webflow Interactions
- Connect to Webflow's visual-first, composable CMS
- Generate new page sections that match your designs using AI Assistant
- Leverage built-in tools for analytics, A/B testing, personalization, and SEO
Learn more about Figma to Webflow
Plugin Details
| Version | 84 |
|---|---|
| Created | October 20, 2022 |
| Last Updated | March 26, 2025 |
| Category | Software development |
| Creator | Webflow Labs |
| Stats | 38386 installs, 6444 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/code.js
- Network Access:
Figma to Webflow uses a backend to authenticate and upload images to your Webflow account.
- Editor Types:figma
- Allowed Domains:
- https://figma-to-webflow-app-ffleandro-webflow-webflow-team.vercel.app
- https://localhost:8080
- https://spa.designtowebsite.io
More Like This
Discover other plugins in the Software development category.