Skip to content

Navigation & menus

Combobox, Command palette (⌘K), Navigation menu, Menubar, Stepper.

stable

Rendered example — light + dark

Light

Command palette

Navigation menu

Menubar

Stepper

  1. Account
  2. 2Profile
  3. 3Review

Dark

Command palette

Navigation menu

Menubar

Stepper

  1. Account
  2. 2Profile
  3. 3Review

Recipes & props

A realistic usage snippet for this component. Imports come from @/components/ui/…. See the source for the full API.

import { Combobox } from '@/components/ui/combobox';
import { CommandPalette } from '@/components/ui/command-palette';

const frameworks = [
  { value: 'astro', label: 'Astro' },
  { value: 'next', label: 'Next.js' },
];

export function Nav() {
  return (
    <div className="space-y-4">
      <Combobox items={frameworks} placeholder="Pick a framework…" />
      {/* Opens on ⌘K */}
      <CommandPalette items={frameworks} />
    </div>
  );
}

Report an issue

Show diagnostics

Environment

 

Console errors

 

Failed requests