Build freely. Build faster.
Create without limits
Import or generate components complete with advanced logic, data integrations, and stateful interactivity.
Use existing components
Tap into available React libraries and share components across sites to reduce repeat work and stay consistent.
Supercharge collaboration
Make customization faster and easier for every team member with predefined props, slots, and variants.
Deliver AEO-ready sites
All code components are rendered server-side for speedy loading, smoother experiences, and strong AEO and SEO.
Use all your favorite tools
Tools
Libraries
UI
“Code Components rock! I can drop full React components straight into Webflow and suddenly things like 3D rendering, external APIs, and advanced interactions are all on the table."
How it works
Develop in your codebase...
Build your way
Maintain control over your source code, versioning, and deployment workflows.
Empower your teammates
Define props so designers and marketers can configure component instances in Webflow without touching your code.
Import into Webflow
Push component libraries and updates to Webflow seamlessly via CLI or CI with DevLink.
...configure in Webflow
Build visually
Drag and drop code components onto the canvas, adjust with props, slots, and variants, and view changes in real time.
Add dynamic content
Connect code component props to your CMS to create, edit, and localize content in-context.
Customize & optimize
Adjust content via props, and add code component instances to A/B tests with Webflow Optimize.
Create in Webflow...
Start with a prompt
Tell the Webflow AI Assistant what you need, like an animated hero, a pricing calculator, an interactive form.
Stay on brand
The AI Assistant pulls from your site's existing design system to keep your component on brand.
Edit your way
Iterate with the AI Assistant chat or edit the code directly and see changes in real time, all without leaving Webflow.
…configure in Webflow
Build visually
Drag and drop code components onto the canvas, adjust with props, slots, and variants, and view changes in real time.
Customize & optimize
Adjust content via props, and add code component instances to A/B tests with Webflow Optimize.
Build standout sites with code components
The power of code. The speed of visual development.