Using Framer

Get help with everything related to the app, tools and troubleshooting.

Code

Animating through Overrides

The Framer Library comes with a set of advanced animation functions. These also work well with overrides.

Read more ›
How to include an SVG in code

The easiest way to include an SVG through code is by directly including it in your component.

Read more ›
Sharing data between components using Overrides

You can communicate between components by sharing data. The Framer Library includes a Data object that holds your data.

Read more ›
Use images from a folder inside your project

You can use url() from the Framer Library to include extra assets.

Read more ›
Using Events through Overrides

Use events to make anything in Framer interactive. Events are things that happen, such as click, tap, and swipe.

Read more ›
Using Framer animations in production

Learn how to use your animations from Framer X in production

Read more ›
Using images in code components

You'll need to reference a URL where the image lives.

Read more ›
Using JSON data in Framer X

Framer X fully supports JSON data.

Read more ›
Using NPM packages in Framer X

Framer X uses NPM with Yarn to manage all dependencies.

Read more ›
Using Overrides

Use overrides to add animations and interactions to Frames and establish communication between components.

Read more ›
View your Preview in a separate browser

You can open your preview in Chrome or Firefox, too.

Read more ›
Working with live data

You can use code in Framer X to work with live data.

Read more ›
Writing components without TypeScript

While Framer X does use TypeScript, you're free to choose.

Read more ›

FAQ

Can I make real apps with Framer X?

Framer X isn’t designed to create real apps, but the are parts that you can re-use.

Read more ›
Can I put my components on Storybook?

Because components you make in Framer X are written in React.

Read more ›
Can I use components from other frameworks in Framer X?

Its fairly easy to write a generic React wrapper for any JavaScript component.

Read more ›
How can I embed my prototypes?

You can embed your prototypes anywhere online.

Read more ›
How can I import my designs from Sketch?

Framer includes a Sketch Plugin that allows you to easily copy and paste.

Read more ›
How can I mask an image in Framer X?

By utilizing the Overflow property you can effectively mask images.

Read more ›
How can I play sounds in my Framer X prototype?

The simplest way to play audio in your Framer prototype.

Read more ›
How do I change my default code editor?

Framer X includes a powerful built in code editor but you can change that to use your favorite external editor.

Read more ›
How do I download a prototype on the Framer Preview app?

You can use the Framer Preview app to download Framer X web previews for offline viewing.

Read more ›
How do I get access to the Framer Web Beta?

Find out more on getting invited to the Framer Web Beta.

Read more ›
How do I get rid of the white background when previewing my prototype?

Follow these steps to get your prototype to behave responsively when previewing.

Read more ›
How do I switch between Day and Night Mode?

You can enable Day and Night Mode either from the menu bar or with a shortcut.

Read more ›
How do I use Framer X behind a proxy?

Framer will automatically detect your proxy settings and securely connect..

Read more ›
How to reinstall Framer X

Learn how to completely reinstall Framer X on your computer.

Read more ›
What are the minimum requirements to run Framer X?

Learn more about the minimum hardware and software requirements for Framer X

Read more ›
What do common Framer terms mean?

Learn what different Framer specific terms mean and why they are important

Read more ›
What happens when I convert a Classic documents to Framer X?

Framer X has a ton of new features and capabilities, made possible by its new React foundation.

Read more ›
Where can I find my project backups?

In Framer X it is possible to quickly jump back in time to an earlier version of your project. 

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 ›
Why are my Sketch assets copied as a single Frame?

It may be that the plugin was not installed correctly in Sketch. Follow the steps to ensure it is.

Read more ›
Why do my exported assets look different than on the canvas?

Sometimes your computer's color profile might be affecting your exports

Read more ›
Why does Framer X ask for permission to record my screen?

After updating to macOS Catalina, Framer X may ask you to record your screen.

Read more ›
Working with fonts

Learn how to work with fonts in Framer X

Read more ›