Powered by React.

Create interactive components from scratch, import production components into your projects, and so much more—only in Framer X.

Try Framer for free ›

Build anything with React.

Interactive components in Framer X are all React-based, which means you can build upon your existing React work instead of replicating it in production. Want even more control? Create custom UI for the properties panel or use our powerful library to animate with React.


React, plus HTML & CSS.

In Framer X, you can write plain React without even having to import the Framer library. Plus, you can render pure HTML elements and use CSS for styling.


Animations, interactions.

Use code to add animations, maintain a global state, make components communicate with each other, and more. Select custom functions directly from the properties panel.


Library imports.

Leverage any of our tools, components, and helper methods from the Framer Library. Build your own Stacks, scroll views, custom transitions, and more.


Design and code in sync.

Import design into code components and code into design components. Create a button and add states in code, or design a row and multiply it in code. Everything stays perfectly synchronized.


Create a custom UI.

Build custom interfaces that display in the Framer X property panel so you can completely fine-tune your components. Define everything from strings and numbers to segmented controls and more.


Even more packages.

Extend the power of Framer X with packages from NPM, which you can easily add to your projects.

Ash Adamson

@framer X’s React codebase will allow our designers to get closer to high-fidelity implementation with engineering.”

Ash Adamson, Flexport

Get Framer X

Bring your creative ideas to life.

Try for free
Framer App

Start your free 14‑day trial.

Enter your email and we‘ll send you a download link for later.

We recently introduced Frames and Shapes, so some information in these videos may be outdated. To learn more visit our Help Center.