The future of design is here.

Try Framer X now

Your new favorite design tool.

Framer X has all the features you need to draw everything from custom icons to intricate illustrations. Fine-tune your designs with our advanced path editor, export anything from your canvas, and more.

Start drawing › Learn more ›

Draw

With predictive snapping, curve bending, and angle locking, Framer X’s path tool is truly unlike any other.

Style

From blurs to blending modes, multiple shadows and border controls, there are hundreds of ways to style your designs.

Export

Export everything from your entire canvas to a single icon. Copy and paste assets or grab production-ready CSS or SVG code.

Justin Mezzell

“I’ve been playing around with some of the illustration tools in Framer X and whoa—they’re crazy powerful.”

Justin Mezzell, Pluralsight

The absolute best layout tools.

Design responsive layouts like you never could before. Framer X is the only tool that automatically adapts your layout when you resize your canvas and lets you use flexible stacks to easily rearrange elements.

Start with layout › Learn more ›

Adaptive

Design for any device on any platform. Framer X keeps UI elements intact whenever you resize a Frame.

Hierarchy

Our layout tool automatically infers constraints and hierarchy, and you can even customize further in the properties panel.

Stacks

Easily distribute, position, and rearrange elements evenly on your canvas with the power of Flexbox.

Sarah Kuehnle

“The team at Dribbble got a demo of Framer X this afternoon and I was blown away. Framer just keeps getting better and better—not by leaps, but bounds!"

Sarah Kuehnle, Dribbble

Everyday interactions, made in seconds.

Create high-fidelity scrolling, paging, and screen-to-screen transitions with our powerful interactive tools—all you have to do is point and click.

Start with interactions › Learn more ›

Fast

Link screens, scroll content, and create beautiful page transitions in just a few clicks. Prototyping never felt so easy.

Advanced

Easily create nested scrolling, pagination, full navigation, modal dialogues, and so much more with Framer X.

High-fidelity

Leverage our powerful physics engine and customize individual transitions to make it feel like the real thing.

Katrina Batina

“Not needing to know code, but having code power all components makes Framer X a groundbreaking tool that brings together the product design toolkit.“

Katarina Batina, Artsy

Interactive components for everything.

Components in Framer X aren’t just any components—they’re fully interactive, reusable pieces that can include everything from live maps to real data to video players.

Start with components › Learn more ›

Reuse

Set up components once and reuse them anywhere. You’ll never have to design the same thing twice.

Customize

Update the master component to reflect changes across the board or refine details on instances.

React-based

Take components to the next level with React. Add logic, interactions, real data, animations, and more.

Meng To

“Your Framer X components can be a single source of truth. Your whole team can contribute both design and code without having to recreate anything. On top of that, you have access to thousands of components powered by a vibrant community.”

Meng To, Design+Code

The world’s first in-app design store.

Find everything from interactive design systems to icons and UI elements in the Framer X Store. Get a head start on your next project or publish your own components for the community.

Explore the store › Learn more ›
store
store

Explore

Browse thousands of packages full of interactive design components like native interactions, UI kits, and more.

Install

Install packages and then drag and drop them onto your canvas. They even stay up-to-date when changes are made.

Publish

Upload your own packages instantly in the app to help others and let them build upon your work.

George Kedenburg III

”The best part is that Framer doesn’t abstract you away from the core. You end up with a large pool of power users who can contribute components back to the masses.“

George Kedenburg III, Facebook

Exclusive team features.

Keep your interactive design system completely in sync with a private store. Get in touch to find out how Framer X can improve your team’s workflow and so much more.

Apply for the beta › Learn more ›
teams teams

React meets design.

Use actual React in your projects to create interactive components from scratch. Want more control? Create custom UI in the properties panel for your components.

Start with React › Learn more ›

Import

Easily import your existing production components into Framer X and then start building upon them.

Customize

Create custom interfaces that display in the property panel so you can completely fine-tune your components.

Animate

Use code to add animations, maintain a global state, make components communicate with each other, and more.

Jeff Smith

“I welcome every Framer X designer to the ReactJS community. Please feel at home — we love to help you learn and answer questions! React components transformed sharing UI code for me. I hope that the Framer X Store will empower so many more people to experience the same.”

Dan Abramov, React

Try Framer X.

The world’s most advanced tool for interactive design has arrived. Get started with Framer X today.

Try it for free ›

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.

Get in touch

Enter your contact info and we’ll get back to you right away.