frutjam/dist/components/kbd.css

A utility-first CSS UI Library for Tailwind CSS

/*! frutjam v2.2.1 (c) 2026 Nezanuha | Released under the MIT License | https://frutjam.com */
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */.kbd{--radius-kbd:calc(var(--border-radius)*1.5);--color-kbd:var(--color-base-soft);--color-on-kbd:var(--color-on-base);--kbd--padding-inline:0.5rem;--kbd--padding-block:0.25rem;--kbd--font-size:0.875rem;display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--kbd--padding-inline);padding-block:var(--kbd--padding-block);font-size:var(--kbd--font-size);font-family:inherit;font-weight:500;line-height:1;white-space:nowrap;vertical-align:middle;background-color:var(--color-kbd);color:var(--color-on-kbd);border-radius:var(--radius-kbd);border-width:1px;border-style:solid;border-color:var(--color-base-active);border-block-end-width:3px;min-width:1.75rem;text-align:center}.kbd-lg{--kbd--padding-inline:0.625rem;--kbd--padding-block:0.3125rem;--kbd--font-size:1rem}.kbd-md{--kbd--padding-inline:0.5rem;--kbd--padding-block:0.25rem;--kbd--font-size:0.875rem}.kbd-sm{--kbd--padding-inline:0.4375rem;--kbd--padding-block:0.1875rem;--kbd--font-size:0.8125rem}.kbd-xl{--kbd--padding-inline:0.75rem;--kbd--padding-block:0.375rem;--kbd--font-size:1.125rem}.kbd-xs{--kbd--padding-inline:0.375rem;--kbd--padding-block:0.125rem;--kbd--font-size:0.75rem}