Sheet 02.24 / Components · Controls

Tag

A mono tag for stacks and topics: lowercase, radius-sm, in a hairline box. Tags are labels, not links.

CLASSb-tagDRAWNCLAUDECHECKEDBOLUOLICENSEMIT

Fig. 1 — taglive, from bundle.css

controls

css typescript svg

Anatomy

Parts

Part	Class	Notes
Tag	`.b-tag`	Mono 12px, muted, hairline border.

Markup

Code

bundle.css

<div style="display:flex;gap:8px;flex-wrap:wrap">
  <span class="b-tag">css</span>
  <span class="b-tag">typescript</span>
  <span class="b-tag">svg</span>
</div>

Keep tags lowercase and short.
Group them in one row.

Don't

Make a tag a link or a button.
Fill a tag with colour.