Kbd

Kbd component.

Example:

// AppServiceProvider, "boot" method.
 
TallStackUi::customize()
    ->kbd()
    ->block('block', 'classes');

# Basic Usage

NEW

Ctrl

<x-kbd text="Ctrl" />

Ctrl + C

<x-kbd text="Ctrl" /> + <x-kbd text="C" />

Ctrl Ctrl Ctrl Ctrl

<x-kbd text="Ctrl" xs />
<x-kbd text="Ctrl" sm />
<x-kbd text="Ctrl" md />
<x-kbd text="Ctrl" lg />

An option to remove the border and shadow for a minimal appearance.

Ctrl

<x-kbd text="Ctrl" borderless />

An option to display a tooltip on hover.

Esc

<x-kbd text="Esc" tooltip="Go back" />

An option to use custom content instead of text.

<x-kbd>
    <x-icon name="arrow-up" class="h-4 w-4" />
</x-kbd>