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.
“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.
“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.
“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.
“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 ›
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.
”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 ›
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.
“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 › Share to win ›