Kbd

'use client';

import { Kbd, KbdGroup } from '@/registry/san-francisco/ui/kbd';

export default function KbdDemo() {
  return (
    <div className="flex items-center gap-1">
      <Kbd>⌘</Kbd>
      <Kbd>K</Kbd>
    </div>
  );
}

'use client';

import { Kbd, KbdGroup } from '@/registry/san-francisco/ui/kbd';

export default function KbdDemoGrouped() {
  return (
    <KbdGroup>
      <Kbd>Shift</Kbd>
      <Kbd>⌘</Kbd>
      <Kbd>P</Kbd>
    </KbdGroup>
  );
}