Skip to content
38

Navigation.

Steppers, product tours, a command palette, theme and language switchers, a mobile tab bar, swipe actions, pull to refresh, a dock, floating toolbars, split views and a table of contents, with keyboard focus that mirrors in RTL.

13 components

Stepper

Navigation

Multi-step progress indicator with horizontal and vertical orientation, completed / active / inactive states, clickable steps and a compound API.

View

Tour

Navigation

Onboarding spotlight that dims the page around a target element and walks users through steps with a positioned coach-mark card.

View

Dock

Navigation

macOS-style dock with cursor magnification: icons scale and spring as the pointer passes, with hover and focus labels. Built on motion.

View

Expanding speed-dial FAB: a primary trigger that rotates open to stagger a stack of secondary actions on any side. Compound API.

View

Floating pill toolbar for text selection and canvas actions, with toggle buttons, separators and labels. Position it anywhere.

View

Split View

Navigation

Two-pane master/detail layout with a draggable, keyboard-accessible divider and min/max bounds, built on shadcn Resizable.

View

On-this-page navigation that tracks the active heading as you scroll and highlights it with a moving border marker. Takes a flat or nested items list, or composes from parts. Smooth scroll respects reduced-motion.

View

Command Palette

Navigation

Keyboard-first command menu with a platform shortcut, nested pages, remembered recents and shortcut hints on each row.

View

Theme Toggle

Navigation

Light and dark mode controls on next-themes: a one-click toggle, a Light / Dark / System menu, and a three-way switcher with arrow-key support. Icons swap with CSS, so the button is right before hydration.

View

Locale menu that lists each language in its own script, with the translated name beside it. The trigger shows the name, the short code or just an icon, and changes report the text direction so the page can flip to RTL.

View

A mobile tab bar with icons, labels, an active pill and count or dot badges. Items can be your router links, it can pin to the bottom clear of the home indicator, and it mirrors in RTL.

View

Swipe Actions

Navigation

List rows that slide aside to reveal actions, like archive or delete in a mail app. Works with a finger or the mouse, leaves vertical scrolling alone, snaps open or shut, mirrors in RTL, and tabbing to an action slides it into view.

View

Pull to Refresh

Navigation

A scroll area that refreshes when pulled down from the top, with a rubber-band feel, an arrow that flips when letting go will refresh, and your shadcn Spinner while it loads. Keeps the page from bouncing underneath.

View