Typography
Kbd
Storybook
Kbd
Storybook
Kbd is a way to represent key combinations in a prominent format
Imports
1import { Kbd } from 'dd360-ds'
1import Kbd from 'dd360-ds/Kbd'
Usage
Ctrl + Shift + R
1import { Kbd } from 'dd360-ds'
2
3<Kbd kbds={['Ctrl', 'Shift', 'R']} />
Separator
You can also customize the separator.
Ctrl * Shift * R
1import { Button, kbd } from 'dd360-ds'
2
3<Kbd kbds={['Ctrl', 'Shift', 'R']} separator='*' />
API Reference
Name | Types | Default |
---|---|---|
"kbds" | Array<string> | Ctrl, Shift, R |
"separator" | string | + |