Kbd
标示一个按键：浮起色、两端带切角的小号斜切块，键名使用正文字体。
安装
# once per project: where @zzzui items come frompnpm dlx shadcn@latest registry add @zzzui=https://zzzui.catforest.dev/r/{name}.jsonpnpm dlx shadcn@latest add @zzzui/kbd示例
句中的按键
Open the palette with ⌘K, take the job with Enter.
Fold the sidebar: Ctrl + B
import { Kbd, KbdGroup } from "@/components/zero/kbd";export default function KbdShortcuts() { return ( <div className="grid gap-3 font-medium font-zero-text text-zero-md text-zero-text-2"> <p> Open the palette with{" "} <KbdGroup> <Kbd>⌘</Kbd> <Kbd>K</Kbd> </KbdGroup> , take the job with <Kbd>Enter</Kbd>. </p> <p className="text-zero-sm"> Fold the sidebar: <Kbd>Ctrl</Kbd> + <Kbd>B</Kbd> </p> </div> );}行为
尺寸以 em 为单位，随周围文字缩放。KbdGroup 将组合键的各个键紧凑排列。