kbd
agentmesh/kbdFreeComponent
shadcn/ui publishes no description for this item.
Live preview
live · rendered by the registry
Rendered by shadcn/ui on their own page — this is the component running, not a screenshot of it.Install it
npx shadcn@latest add https://raw.githubusercontent.com/ombhanushaliii/agentmesh/main/example/ui/apps/v4/public/r/styles/base-vega/kbd.jsonSource
1import { cn } from "@/registry/base-vega/lib/utils"23function Kbd({ className, ...props }: React.ComponentProps<"kbd">) {4 return (5 <kbd6 data-slot="kbd"7 className={cn(8 "pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 [&_svg:not([class*='size-'])]:size-3",9 className10 )}11 {...props}12 />13 )14}1516function KbdGroup({ className, ...props }: React.ComponentProps<"div">) {17 return (18 <kbd19 data-slot="kbd-group"20 className={cn("inline-flex items-center gap-1", className)}21 {...props}22 />23 )24}2526export { Kbd, KbdGroup }
Files it writes
More from shadcn/ui
All 201 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| accordionaccordion | shadcn/ui | Components | Free | no deps | |
| alertalert | shadcn/ui | Components | Free | no deps | |
| alert-dialogalert-dialog | shadcn/ui | Components | Free | no deps | |
| aspect-ratioaspect-ratio | shadcn/ui | Components | Free | no deps | |
| avataravatar | shadcn/ui | Components | Free | no deps | |
| badgebadge | shadcn/ui | Components | Free | no deps | |
| breadcrumbbreadcrumb | shadcn/ui | Components | Free | no deps | |
| buttonbutton | shadcn/ui | Components | Free | no deps |
