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.

ImageImage
Design visually

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

ImageImage
Export to React

Transform Webflow components into React components with a single command.

ImageImage
Preserve design systems

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

ImageImage
Stay in sync

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

Get started with Exported Components

ImageImage
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:

ImageImage
Design Guidelines

Learn how to structure and design components in Webflow for clean export to React.


Learn more
ImageImage
Usage Documentation

Discover how to integrate and extend DevLink components in your React projects.


Learn more