Frequently Asked Questions

Should I use code in Framer?

Framer is a site builder that doesn't require code. Code in Framer is a way to extend the application beyond that standard (very extensive) functionality.You should use code in Framer if you are comfortable with React and JavaScript and need to add something dynamic to your website that Framer cannot provide out of the box, like a menu login button, a custom form, or a metric integration.

Is Framer a full blown developer platform?

Can it help me write code? No. Framer uses code as an escape hatch to extend capabilities to for example add small dynamic parts to a site. If your project needs a lot of logic and components we advice to create a normal React application instead.

What happens if I make a bug in my custom code?

Code in Framer shares the runtime and dom with everything else. That means that you can do anything, but also that subtle bugs can break your entire site. In short, with great powers comes great responsibility and we advice to only use it for production projects if you’re comfortable writing production quality code.

My custom code isn’t working as expected, can you help me debug?

Unfortunately we don’t have the resources to support your custom code for obvious reasons, but our #developers community channel channel is very popular and a great place to ask questions.

Can I share my code components across projects?

Yes. You can simply copy and paste code components across projects and it will work. If you have a set of components that you would like to share with your team, you can organize them in a central project or even publish them as a mini website. If you write the component url to the clipboard, Framer can paste it and will load your component.

Can I import Framer components into my React application directly?

Framer components are React Components based on ES Modules. That means that you can technically import them into other projects, but in reality there are quite a few hurdles to overcome, so we only recommend this for testing or if you really know what you are doing. We had experimented with making the experience easier for this with a beta feature called Handshake. But as this relied on the Next.js compiler which is currently being rewritten and browser features that aren't broadly supported yet, you should consider it very experimental for some time.

Can I import npm packages?

Importing npm packages is currently an experimental feature. Most packages typically don’t work unless unless they were built specifically for Framer. Some projects with multiple npm imports may run into errors with adding multiple npm dependencies, as sub-dependency conflicts can occur.

Should I use external code libraries with Framer?

Framer can import any ES Module based code. But the code itself generally is only useful in Framer if it’s made for Framer. So importing large libraries that did not have Framer as the main use case in mind will likely not yield the expected results.

Should I add state management to let components communicate?

This may be alright in some cases, but if you need to do advanced logic, you are often better off with a real React application. Both Framer and your state management will try and control components, and conflicts can cause subtle bugs.

Should I use code to integrate tokens or build design systems for my team?

No. While many designers dream about a deeper design and production integration with code, Framer is not currently setup to get great results for that use case.