dokk

Badges, keys and colors

These work inside any text, including headings, lists and tables.

Badges #

Inline, inside any text: :badge[Text], with an optional variant: default, secondary, outline or danger.

Search :badge[New] works offline :badge[Beta]{variant="secondary"}.

Search New works offline Beta.

Keys #

:kbd[...] shows a keyboard key.

Open search with :kbd[Ctrl+K].

Open search with Ctrl+K.

Color swatches #

:swatch[...] shows a small chip of any CSS color: a hex value, a name or a function such as oklch(). The color is also its accessible name.

The brand pink is :swatch[#db2777] `#db2777`.

The brand pink is #db2777.