Mobile Navigations: Transitions Update

This release introduces three new features designed to improve navigations in Framer. First, we’ve added viewport unit support to the Height property of any layer within a Variant. This helps you design new interactions, such as backdrops that should fade in-and-out. Second, we’re upgrading the Transition property, which now can be added to any layer within your Variants. This gives you precise control over your animations, allowing you to target specific layers to animate, and exclude others. Third, we’re adding support for Transitions to Link Styles, so all of your links can now be animated on Hover. Combined, these features unlock new types of mobile navigations—beyond ones that animate to fill the viewport height. Watch the video above to learn more, or remix our demo here.

• You can now use Viewport units for Height in Component Variants

• You can now assign the Transition property to any layer within a Variant

• Link Style states, like Hover, can now be animated with an Easing Transition

• Fixed Variants with Delay not switching instantly between Breakpoints