Hover-Expanding Icon Rail in CSS, Bootstrap & Tailwind
A dark 66px icon rail for app layouts that widens to 222px when a pointer rests on it or keyboard focus enters it, unrolling a text label beside every icon.
Or browse by category:
Bottom Sheet Action Menu in CSS, Bootstrap & Tailwind
A mobile-style action sheet that slides up from the bottom of the screen over a dimmed page.
Radial Quick Action Menu in CSS, Bootstrap & Tailwind
A round indigo action button that fans five circular shortcuts out along a half circle above it: New document, Upload file, Invite people, Start a cal
Footer Sitemap Navigation in CSS, Bootstrap & Tailwind
A dark site footer with a brand column and four link columns (Product, Company, Resources, Legal), finished with a copyright line and a short row of l
Progress Step Navigation in CSS, Bootstrap & Tailwind
Two progress indicators for multi-step flows. The horizontal one is a four-step checkout (Basket, Delivery, Payment, Confirm) with numbered circles jo
Fullscreen Overlay Menu in CSS, Bootstrap & Tailwind
A studio-style header whose Menu button opens a full-screen dark overlay with four large links (Work, Studio, Journal, Contact) and a row of social an
Sticky Table of Contents in CSS, Bootstrap & Tailwind
An “On this page” contents list that stays beside a long article and highlights the section being read.
Filter Pill Navigation in CSS, Bootstrap & Tailwind
Two filter patterns for listing pages. Filter navigation is a single row of pill links, each with a count badge (All 248, Templates 96, Components 74
Nested Flyout Navigation Menu in CSS, Bootstrap & Tailwind
A vertical app menu whose parent items open flyout submenus to the side, two levels deep.
Breadcrumb Trail Navigation in CSS, Bootstrap & Tailwind
Four breadcrumb trails that show where a page sits in a site.
Navbar with Hover Dropdowns in CSS, Bootstrap & Tailwind
A white top navigation bar with a logo, two dropdowns, two plain links and an indigo Start free button on the right.
Morphing Hamburger Drawer Menu in CSS, Bootstrap & Tailwind
A mobile-style header with a logo and a three-bar hamburger button.
Full-Width Mega Menu in CSS, Bootstrap & Tailwind
A navigation bar whose Platform item opens a full-width panel.
Animated Nav Link Indicators in CSS, Bootstrap & Tailwind
Four horizontal link bars that each mark the current page a different way.
Floating Dock Menu in CSS, Bootstrap & Tailwind
A macOS-style dock of app shortcuts floating on a gradient. Seven rounded tiles (Home, Mail, Photos, Music, Code, Terminal and Trash) sit on a frosted