Dark Mode
Colors
Drag And Drop
Forms
{"@context":"https://schema.org","@graph":[{"@type":"TechArticle","headline":"Keyboard","description":"Keyboard and focus support ensures smooth navigation with keys, essential for users without a mouse and power users for quick access. It enhances accessibility.","url":"https://intentui.com/docs/components/controls/keyboard","author":{"@type":"Person","name":"Irsyad","url":"https://x.com/irsyad"},"publisher":{"@type":"Organization","name":"Intent UI","url":"https://intentui.com","logo":{"@type":"ImageObject","url":"https://intentui.com/icon.svg"}},"mainEntityOfPage":{"@type":"WebPage","@id":"https://intentui.com/docs/components/controls/keyboard"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://intentui.com"},{"@type":"ListItem","position":2,"name":"Docs","item":"https://intentui.com/docs"},{"@type":"ListItem","position":3,"name":"Components","item":"https://intentui.com/docs/components"},{"@type":"ListItem","position":4,"name":"Controls","item":"https://intentui.com/docs/components/controls"},{"@type":"ListItem","position":5,"name":"Keyboard","item":"https://intentui.com/docs/components/controls/keyboard"}]}]}
Keyboard
Installation
Install the component via the CLI in one command.
npm
pnpm
yarn
bun
npx shadcn@latest add @intentui/keyboard
Manual installation
Use this approach if you prefer to install and wire up the component yourself instead of using the CLI.
npm
pnpm
yarn
bun
npm install react-aria-components tailwind-merge
Component API
Keyboard
Keyboard extends the React Aria Components <Keyboard> component.
classNamestringSee the React Aria interactions reference for the full API reference.
