Kbd

Represents keyboard input or a hotkey.

Shift + Tab
<Kbd>Shift + Tab</Kbd>

API Reference

This component is based on the kbd element and supports common margin props.

PropTypeDefault
asChild
boolean
No default value
size
Responsive<enum>
No default value

Examples

Size

Use the size prop to control text size.

Shift + TabShift + TabShift + TabShift + TabShift + TabShift + TabShift + TabShift + TabShift + Tab
<Flex direction="column" align="start" gap="3">
<Kbd size="1">Shift + Tab</Kbd>
<Kbd size="2">Shift + Tab</Kbd>
<Kbd size="3">Shift + Tab</Kbd>
<Kbd size="4">Shift + Tab</Kbd>
<Kbd size="5">Shift + Tab</Kbd>
<Kbd size="6">Shift + Tab</Kbd>
<Kbd size="7">Shift + Tab</Kbd>
<Kbd size="8">Shift + Tab</Kbd>
<Kbd size="9">Shift + Tab</Kbd>
</Flex>
PreviousEm
NextLink