Compare component types in Webflow
You can use native components, code components via DevLink, or AI-generated components in Webflow — each with different workflows and limitations.
| Type |
Native components |
DevLink Code components |
AI code components |
| Definition |
Components built visually in Webflow |
Components created in an external codebase (React), then imported into Webflow |
Components created in Webflow with the Webflow AI Assistant’s code generation capabilities (written in React) |
| Method of creation |
Build visually on Webflow’s drag-and-drop canvas or on the Component Canvas
|
Write code in an IDE outside Webflow |
Provide semantic prompt to Webflow AI Assistant |
| Limitations |
Source of truth is Webflow — changes must be made in Webflow |
Source of truth is the external codebase — changes must be made in code. Not compatible with the Component Canvas. |
Source of truth is Webflow — changes must be made in Webflow |
| DevLink relevance |
Can be exported as React components using DevLink |
Can be imported into Webflow using DevLink |
Do not require DevLink |
| Example usage |
Use native components exported via DevLink to build full-stack web apps |
Migrate a React site to Webflow or import advanced UI components for designers to use |
Build advanced UI (like a locator) directly in Webflow using AI-generated React code |