We’re constantly improving Framer. See the latest features and improvements.
These improvements to Variant creation and editing will make your component creation workflow 10x simpler. Now you’re able to add, delete, duplicate, sort, and drag layers in any Variant instead of only being able to make changes to the Primary. This means you have maximum flexibility in your component creation process and can unlock component interactions for any use case.
The Team Library is a new and improved way to share and manage Smart Components with your whole team. You can add any Smart Component to the Team Library from the Component Canvas to make them available instantly to your team from the Insert Menu.
Once your component is added you can create a description so team members can ensure they select the correct component before inserting it into their own projects. This release is one of many to support better component management.
Copy and paste for Smart Components now supports updating. This means when you paste a component from one project to another, any updates you make to the original component, known as the Primary, will be reflected in the pasted instance when you click the ‘Update’ action next to the component name.
To test out this smooth new workflow we added a Design System folder in your dashboard that comes with some example components. You can customize these components, make them your own, then paste them in any existing project—and of course you can continue iterating and experimenting with these components and get the updates everywhere you pasted them.
Auto Size is here. Not only can you create truly dynamic designs that adjust to changes in content, but also buttons that change size on hover and click, accordions, dropdowns, and more thanks to some intuitive properties.
Use the Grow property to ensure that changes to text are reflected in the surrounding elements. Just set the Grow property to Auto Width or Auto Height and watch everything fall into place with copy updates. Stretch layers in any direction and control padding independently by dragging the handles that appear when an element with Auto Height or Width is selected.