UI Blocks.
Pre-built, composed sections ready to drop into your Next.js application.
Aurora Glass Nav
A vibrant organic glass navbar with shifting, blurred gradient orbs trapped behind heavy frosting. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Cinematic Bento Mega-Menu
A desktop navigation bar that expands into a rich cinematic bento grid on hover. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Command Line Navbar
A terminal-inspired navbar where navigation looks like a CLI command with a typewriter output line. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Crystal Reveal Nav
A navbar that materializes from nothing into a crystal-clear glass block upon scrolling. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Disappearing Scroll Header
Fixed Disappearing Scrolling Header. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Dynamic Island Navbar
A floating pill-shaped navbar that expands smoothly when interacted with, inspired by Apple's Dynamic Island. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Editorial Navbar
A magazine-style full-width navbar with column layout, text scramble on hover, a colored gradient progress bar, and numbered page indicators. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Elastic Scroll Nav
A top navigation bar that physically reacts to the velocity of your page scroll with elastic physics.
Pro
Expanding Menu Navbar
A premium navbar with animated hover-triggered dropdown groups, each with color-coded gradient accents. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Floating Navbar
A floating, animated navbar with mobile menu overlay. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Floating Toolbar
An elegant floating toolbar with animated selection indicators. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Frosted Glass Dock
A macOS-inspired floating dock made of thick, frosted glass with glossy borders. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Fullscreen Menu
An immersive full-screen overlay menu with staggered link entrance animations. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Glass Morphing Navbar
A glass navbar that changes shape on scroll. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Gliding Glass Pill
A floating pill navigation where the active indicator itself is a piece of sliding frosted glass. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Glow Navigation
A futuristic navigation menu featuring glowing active states and hover effects. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Holographic Navbar
A sci-fi holographic projection navbar with moving scanlines, chromatic aberration on hover, corner brackets, and random flicker effect. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Hover Reveal Nav Header
A giant editorial navigation where each link reveals a sliding background pill and arrow on hover. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Liquid Morph Tab Bar
A floating navigation pill where the active state indicator behaves like an organic liquid. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Mac OS Dock
An interactive dock component inspired by macOS dock with animation capabilities. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Magnetic Pull Navbar
Each nav item has magnetic pull physics — items physically drift toward your cursor and snap back, revealing a sub-label when active. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Magnetic Slide Navbar
A clean, minimalist top navbar with a magnetic sliding background indicator. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Minimalist Reveal Navbar
A smart navbar that hides on scroll down and reveals on scroll up or hover near the top edge. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Morphing Sidebar Nav
A sleek vertical sidebar on desktop that morphs into a fluid bottom navigation on mobile. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Navbar
A clean and highly responsive navigation header designed for modern web apps. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Neon Sign Navbar
A retro neon sign navbar where each item is an individually illuminated neon sign that flickers to life on activation with a startup sequence. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Neon Underline Navbar
A dark hacker-style navbar with an electric neon bar that shoots between links with a glowing violet trail. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Notch Navbar
A modern floating navigation bar resembling a device notch that expands smoothly. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Overlapping Glass Panes
A multi-tiered navigation system that uses overlapping blurs to create gorgeous depth. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Particle Burst Navbar
An interactive navbar that explodes a burst of colorful particles from your cursor on every click. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Scrolling Progress Header
A sticky navbar with a reading progress bar at the bottom edge and active section highlighting. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Solari Flip Navbar
An airport departure-board inspired navbar where characters flip through random glyphs to reveal each destination, with amber neon glow. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Spotlight Glow Navbar
A sleek top navigation bar featuring a high-end spotlight effect that tracks the cursor. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Sticky Headers Be Sticky
A beautifully designed Sticky Headers Be Sticky block section. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Text Roll Navigation
Navigation menu with text roll hover effects and staggered character animations Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.
Pro
Tilt Card Navbar
A 3D perspective navbar that physically tilts to follow your mouse with a live glare reflection effect. Built with React, Tailwind CSS, and Framer Motion. Enhance your Next.js projects with this free, copy-paste ready navbars & menus element.