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 | Code components via DevLink | 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 | 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 | 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 |