geist mono

geist mono

Search…

Dropdown

Dropdown

Version 1

Menu

Version 2

Edit post

Head to the desktop site to copy.

Updated:

Feb 7, 2024

Type:

No-code

Notes

  • An expanding contact menu with mouse-follow highlight.

  • All dropdown options are manually staggered by incrementing the delay inside the transition of their appear effect.

  • Where possible, handle SVG colour transitions using opacity (rather than two different colours) to create smoother hover effects.

  • Be mindful when animating borders and shadows with Framer Motion.

  • For faster loading speeds, add SVGs directly, rather than using Framer's icon components.

Help

How do I add Framer components?

How do I add code overrides?