Rail NavBar

Prism Rail is a premium, fully responsive rail navbar for Framer, designed to give modern websites a more distinctive and interactive navigation experience.

Prism Rail is a premium, fully responsive rail navbar for Framer, designed to give modern websites a more distinctive and interactive navigation experience. On desktop, Prism Rail sits as a slim floating vertical navigation on the left or right side of the screen. In its compact state, it keeps the interface clean with icons, branding, active-section styling, and scroll progress. When visitors hover over it, the rail smoothly expands to reveal navigation labels, section numbers, brand text, and the current scroll percentage. The active state moves between links as users explore different sections, while optional smooth scrolling can take visitors directly to areas such as Home, Work, Services, About, and Contact. The component also includes subtle hover interactions, premium glass styling, and a refined active-section highlight. Prism Rail automatically adapts for smaller screens. On tablet and mobile, the vertical rail transforms into a compact floating bottom navbar built for touch interaction. Labels can remain visible on larger mobile layouts and simplify on very small screens for a cleaner experience. Everything is editable directly inside Framer. Customize the brand name, navigation labels, links, icons, accent color, surface color, text colors, rail position, collapsed width, expanded width, corner radius, side offset, blur, transparency, mobile position, section numbers, progress indicator, smooth scrolling, and mobile labels. Perfect for portfolios, creative agencies, studios, SaaS websites, personal sites, product showcases, and other modern Framer projects that need navigation with more personality. Prism Rail is responsive across desktop, tablet, and mobile and includes a dedicated static-renderer fallback for reliable use inside Framer.

Responsive rail navbar for Framer!