Learn about Framer's tools, features, and best practices.
Dashboard and Projects
How to find your way around Framer's dashboard.Read more
Importing from Figma
How to import a Figma project to Framer.Read more
Importing from Sketch
How to import a Sketch project to Framer.Read more
Importing from Framer Desktop
How to get your desktop projects to Framer on the web.Read more
Teams and Folders
How to use Teams and Folders to organize your projects.Read more
Archiving a Project
How to archive a project.Read more
Best Practices for setting up a Team
Learn the best approaches on setting up your team.Read more
A collection of tools and menus to help you design.Read more
An infinite area where you can create and organize your design.Read more
A tree view of every Frame, Component and other layer on your canvas.Read more
Inspect and edit a layer's layout, styling, and other properties.Read more
All of the commands for tools, panels, and functions.Read more
A container for other layers.Read more
An auto-sizing container for styled text.Read more
A container that applies a stack layout to its layers.Read more
A component with scrollable contentRead more
A component with paginated content.Read more
A static vector image.Read more
An editable vector graphic.Read more
A reusable Frame with a master and instances.Read more
An advanced component written in code.Read more
Use the Insert Menu to find components, patterns, packages and more.Read more
Collections of components and shared colors.Read more
A collection of interactive and customizable components.Read more
Create and edit a collection of reusable colors.Read more
Rulers and Guides
Position layers exactly where you want them.Read more
Replace a layer with a component.Read more
Create custom vector graphics in Framer's drawing mode.Read more
Page and Scroll Interactions
Find out how to add scroll and page interactions.Read more
View your project's interactive prototype.Read more
Navigate between layers.Read more
Trigger actions and transitions in your prototype.Read more
Smoothly animate a transition.Read more
Design an animation.Read more
Real time Collaboration
How to work together in Framer.Read more
How to leave comments, replies, and resolve issues.Read more
Organizing your team package files
How to keep your team packages organized.Read more
Deleting a package from your Team
How to safely delete a team package.Read more
Create a link to share your prototype online.Read more
Previewing on a mobile device
How to view your prototype on mobile device.Read more
Adding a Device Frame to your prototype
Learn to use the Device component.Read more
See distances between layers and copy layer properties as code.Read more
Export your designs as images.Read more
How to use the Framer CLI to publish automatically.Read more
Publishing from the CLI
How to publish packages from the Framer CLI.Read more
Integrating projects with git
How to collaborate on a Framer project with git.Read more
Working with folder-backed projects
How to save a Framer project as a folder.Read more
Handing off from the desktop app
Best practices to hand off a desktop app projectRead more
Importing a React Design System
How to use an existing React library in Framer.Read more
Export Project as an HTML prototype
How to export your project as a bundled HTML prototype.Read more
Using NPM packages in Framer
How to add and manage a project's dependencies.Read more
Previewing in the browser
How to preview your prototype in a separate browser.Read more
Changing your Framer Library version
How to downgrade or upgrade your version of the Framer Library.Read more
Using images in Code Components
How to include an image in your code.Read more
Restoring from a project backup
For projects created with the desktop app, it is possible to jump back in time to an earlier version of your project.Read more
Using an external code editor with the desktop app
How to use your own text editor to edit your project's code.Read more
Can I embed my prototypes elsewhere?
How to embed a project online.Read more
Can I put my components on Storybook?
How to use Framer together with Storybook.Read more
Technical requirements for the desktop macOS app
Learn about the hardware and software requirements for Framer’s desktop app.Read more
Download a prototype to the Framer mobile app.
Learn to download a preview for offline viewing.Read more
Importing Package Components in code
How to include package components in your Code Components.Read more
Getting existing React components on your canvas
How to include NPM package components in your Code Components.Read more
Why does Framer ask for permission to record my screen?
How to set up permissions on macOS Catalina.Read more
Authenticating with a Framer Token
How to set up a Framer Token to installing NPM packages.Read more
Setting custom fonts from code
How to use local fonts in a code component.Read more
Differences between the Framer desktop and web app
See the differences between the web and desktop versions of Framer.Read more
Framer Desktop app
Framer also has a macOS desktop app, learn what it does.Read more
Changes to Framer X
Framer X will continue to exist, only under a different name.Read more
Requesting a new sign-in link
How to get a fresh link to sign into Framer.Read more
Activating your account
How to activate your Framer account.Read more
Where can I request a feature?
Learn where you can request new features.Read more
Which domains does Framer require?
Framer requires certain domains to be accessible.Read more
How do I import my Sketch and Figma projects?
To easily turn your designs into prototypes, Framer allows you to import from Figma and Sketch.Read more
Changes to Framer
With our web release, we’ve changed a lot. Learn what’s new.Read more
Can I work offline in Framer Web?
Learn about how Framer for the web works online and offline.Read more
What are these common Framer terms?
Learn some of Framer's terminology.Read more
What happens when I convert a Classic document to Framer?
Learn how documents from Framer Classic are converted to Framer.Read more
Can I make real apps with Framer?
Learn where Framer fits in a development process.Read more
How can I play sounds in my Framer prototype?
How to include audio in your prototype.Read more
Can I use Framer with a proxy?
Yes, Framer should automatically recognize proxy settings.Read more
Why do my exported assets look different than on the canvas?
How to ensure that your computer's color profile is set up correctly.Read more
Why are my Sketch assets copied as a single frame?
How to make sure that your Sketch imports are working correctly.Read more
How do I switch between Day and Night Mode?
Learn how to set Framer's theme through the application menu.Read more
Why am I seeing background blur artifacts?
The background blur property is still in beta and not fully supported by all browsers.Read more
Masking an Image
How to mask images using the Overflow property.Read more
How do I update my Avatar?
How to change your avatar in Framer Web.Read more
What is Framer Tools?
How to install and use the Framer Tools application.Read more
Does Framer support version control?
How to manage versions in Framer.Read more
What’s changing to my existing Framer license?
With Framer Web, some changes will happen to your license.Read more
How to control your prototype with code.Read more
Communicating between Components
How to use overrides to share data across components.Read more
Animating with Overrides
How to animate in your prototype with code.Read more
Using Events through Overrides
How to make things happen in response to user actions.Read more
Create files and edit your code.Read more
Using Code In Framer
Read how to enable Code within Framer.Read more
Working with live data
How to bring live data into your prototype.Read more
Using JSON data in Framer
How to bring local data into your prototype.Read more
Adding Property Controls to a Code Component
How to create a custom user interface for your component's properties.Read more
Writing Components without TypeScript
Working with non-React components in Framer
Using SVGs in code
How to include an SVG image in your code.Read more
Using Framer animations in production
How to use your animations from Framer in production.Read more