REACT-NATIVES
WIRED FOR SPEED
react-natives v2.1.2
Theme
Light
Dark
Get Started
Menu
Components
Data Display
Kbd
Displays a keyboard shortcut or key combination.
Example
Preview
Code
Props
Kbd Props
Prop
Type
Default
Description
className
string
NativeWind utility classes to apply to the keyboard key element.
Usage Guidelines
When to use
Use Kbd to render keyboard shortcuts, hotkeys, or key combinations in documentation or help text.
Best practices
Wrap individual keys in separate Kbd elements for multi-key shortcuts (e.g. Kbd+Kbd).
Use Kbd only for actual keyboard keys — not for general inline code.
Combine with Text to provide context around the shortcut.
Accessibility
Kbd renders with a semantic keyboard role. Screen readers will announce the key text content.
Related Components
Code / CodeBlock
Displays inline code snippets or multi-line code blocks.
Text
A typographic component for rendering text with built-in size, weight, and decoration variants.
React-Natives
A comprehensive React Native component library.
Documentation
Getting Started
Components
Theming
Community
GitHub
Discord
Twitter
Blog
Support
FAQ
Contact
Contributing
License
© 2026 React-Natives. Wired by WireServers-UI.