Component Export

Design in Webflow, export to React

With DevLink, you can export Webflow designs directly to React. Designers create reusable components visually in Webflow, and developers use DevLink to bring those components into React projects, including Webflow Cloud apps, with ease.

Design visually

Create components using Webflow’s visual editor with no code required.

Export to React

Transform Webflow components into React components with a single command.

Preserve design systems

Preserve styles, variables, components and interactions from your Webflow design.

Stay in sync

Update your design system in Webflow, then sync changes to your codebase.


Get started with Exported Components

Get Started

Follow the Getting Started guide to configure your project for DevLink and export your components.



Working with Exported Components

DevLink translates your Webflow components into React components through a simple workflow:

1

Design in Webflow

Create styles, variables, and components in Webflow’s best-in-class visual editor.

3

Sync your design system

Use the Webflow CLI to export and sync styles, variables, and components to your project.

4

Use your design system in your React app

Import the global styles and generated React components into your application code.

5

Add functionality

Enhance the components with custom logic, state, and interactivity.

Learn more

Explore to use Exported Components in your React projects: