Shadcn.io is not affiliated with official shadcn/ui
Navbar Portfolio
A creative portfolio navigation bar built with React, Next.js, shadcn/ui, and Tailwind CSS. Features a designer or developer name as logo, minimal navigation links for Work, About, Services, and Contact, and a green availability indicator dot with status text using framer-motion animations.
Make a strong first impression with this portfolio navbar designed for freelancers and creative professionals. Your name takes center stage as the logo, four essential navigation links guide visitors through your work, and a green availability indicator tells potential clients you are open for projects. The generous whitespace and minimal design let your portfolio work speak for itself. Built with framer-motion for smooth entrance and hover animations.
Related Components
Social Links Navbar
Navbar with integrated social media icon buttons
Blog Navbar
Publication navbar with category navigation
Landing Page Navbar
Marketing navbar with conversion-focused CTAs
Minimal Navbar
Clean minimal navbar with hover underlines
Floating Pill Navbar
Pill-shaped floating navigation
Transparent Hero Navbar
Glass navbar for hero sections
FAQ
Was this page helpful?
Sign in to leave feedback.
Podcast Platform
A podcast platform navigation bar built with React, Next.js, shadcn/ui, and Tailwind CSS. Features a PodWave logo with headphones icon, Discover, Library, Following, and Charts nav links, a now-playing episode indicator with animated bars, a search button, and a Create Podcast CTA with framer-motion entrance animation.
Progress Indicator
A navigation bar with animated progress indicator built with React, Next.js, shadcn/ui, and Tailwind CSS. Features a thin progress bar at the top showing profile completion percentage, a logo, nav links, a completion status label, and a Complete Profile call-to-action button, all animated with framer-motion.