You can use the Insert Menu to add components, patterns, and packages to your project.
To open the Insert Menu, click the + icon on the Toolbar.
How to find the Insert Menu
The Insert Menu contains six different content sections:
- Frames contains common Frame sizes and devices
- Interactions has pre-built interaction patterns, such as a Scroll component with a content layer already attached
- Default Components is a collection of interactive Code Components to help with common interface elements
- Project Components contains all of the Design Components and Code Components that you’ve made in your project, including those that you’ve installed from packages.
To view a category’s content, click on the category’s name.
View a category’s content by clicking on the category’s name
When you enter a category, the list will show the category’s content and the search bar will show the category’s name. To exit a category, click the x next to the category’s name.
To insert an item, double click its name.
You can also select items with your keyboard. Move the list’s focused item using the Up and Down keys on your keyboard, then press Enter to select the focused item.
You can use the Insert Menu’s search bar to find content across all categories.
To use the search bar, open the Insert Menu and begin typing. As you type, the list will show suggested items organized by category.
Tip: There are thousands of public components created by other designers in the Framer community. If you’re curious, try searching for some terms like 3D, design system, or animate.