Componentes

Kbd

Exibir atalhos de teclado na UI.

Ações e indicadores

Carregando demonstração…

Código da demo
"use client";

import { Kbd, KbdGroup } from "@/components/ui/kbd";

export function Demo() {
  return (
    <div className="flex flex-wrap items-center gap-fe-3 fe-body text-muted-foreground">
      <span>
        Salvar{" "}
        <KbdGroup>
          <Kbd>⌘</Kbd>
          <Kbd>S</Kbd>
        </KbdGroup>
      </span>
      <span>
        Busca <Kbd>⌘K</Kbd>
      </span>
    </div>
  );
}
Acessibilidade
Texto do atalho legível; não depende só de símbolos.
Importar
import { Kbd, KbdGroup } from "@financeequity/ui/kbd"

Neste repositório:

import { Kbd, KbdGroup } from "@/components/ui/kbd"