Skip to content

component

Pie Menu

By Aidan Looker

Details

Summary

What is Pie Menu?

Description

What is Pie Menu? Pie Menu is a radial floating action button that fans menu items outward in a smooth, animated arc. Click the trigger to reveal up to eight action items arranged in a full circle, half circle, quarter arc, or any custom range. Use it as a sticky viewport FAB for quick-access navigation, a contextual toolbar for content actions, or a creative interaction element that sets your site apart. Includes three curated themes, a glassmorphism mode, and full custom colour control. Core Features Three built-in themes - Midnight, Frost, and Glass - plus a fully customisable colour mode for trigger, items, labels, and overlay Seven sticky viewport positions Three spring animation presets - Pop, Elastic, and Smooth - with adjustable stagger timing for cinematic reveal sequences Smart label placement that adapts to item angle and viewport edge, supporting always-visible, hover, and hidden modes Background dim and blur overlay effects to draw focus to the menu when open 18 built-in icons covering common actions: share, bookmark, edit, trash, copy, link, download, upload, settings, search, home, user, heart, star, camera, mail, phone, and chat Controls inside Framer Menu Items Up to 8 items, each with selectable icon, custom label text, and native Framer link Theme Midnight, Frost, Glass, or Custom Position Canvas (manual placement) or sticky: Bottom Right, Bottom Left, Top Right, Top Left, Center Left, Center Right Arc Type (canvas mode only) Full Circle, Half Circle, Quarter, or Custom with start and end angle controls Layout Radius (50-250 px) Direction: Clockwise or Anticlockwise Item Spacing (angular gap between items) Trigger Button Size (36-80 px) Shape: Circle or Rounded Square Icon selection Open-state rotation amount Shadow intensity Item Style Item size and icon size Background style: Solid or Glass (frosted glassmorphism) Label display mode: Always, On Hover, or Hidden Animation Preset: Pop, Elastic, or Smooth Stagger delay per item (20-120 ms) Colors (Custom theme only) Trigger background and icon colour Item background and icon colour Label background and text colour Overlay colour Overlay Dim Background toggle with adjustable opacity Blur Background toggle with adjustable blur amount Behaviour Auto-close on item selection Close delay on mouse leave (0-1000 ms) Label font selection Best use cases Floating action button for SaaS dashboards, portfolios, and marketing sites Contextual quick-action toolbar for content-heavy pages Mobile-inspired radial navigation for creative or interactive landing pages Sticky viewport menu for social sharing, bookmarking, and editing shortcuts Drop Pie Menu onto your canvas and go from static page to interactive experience in under a minute. Questions or custom requests? We design and build custom Framer components. Get in touch at contact@teampixel.com.au .

Introduction

Radial menu with spring animations.

Rank history

Daily rank per list, from the first snapshot — lower is better.

120014001600178928/148/228/309/79/15
  • All · #7882