Kbd

The Kbd component creates a semantic HTML keyboard input element that visually represents keyboard input or shortcuts. It provides consistent styling for keyboard-related content.

Semantic HTML kbd element

Flexible size adjustment

Architecture

so-kbd
Slot: default

Reference

  • Kbd

    The component that renders a semantic HTML kbd element. Content placed within this component will be styled to appear as keyboard input or shortcuts.

    • Attributes

      • id
        string
        / default: -

        A unique identifier for the keyboard input element. This attribute is used for targeting the element with custom styling or scripting.

      • size
        enum
        / default: md

        Controls the text size of the keyboard input element. The default md size provides standard readability, while other options allow for flexible scaling to match different design contexts. Values range from xs to 6xl.

made for toddle