Under Construction

We're actively working on new components and features. Stay tuned! Head over to our GitHub to see what's coming next.

Let’s build together on our Discord.

The Kbd component visually represents keyboard keys and shortcuts, making it easy to communicate keyboard interactions in documentation and interfaces.

Ctrl + C
React
import Kbd from "@radui/ui/Kbd"; const KbdExample = () => ( <Kbd>Ctrl + C</Kbd> )
  • Visual representation of keyboard keys and shortcuts
  • Pre-styled with appropriate borders and shadows
  • Customizable with size variants
  • Maintains semantic meaning with proper <kbd> HTML element
  • Ideal for documenting keyboard interactions and shortcuts

A component that visually represents keyboard buttons or key combinations, often used in documentation to indicate keyboard shortcuts or commands.

PropTypeDefault

children

ReactNode--

className

string''

customRootClass

string''

size

string''