API Reference

Badge

An inline status chip with a broad colour, size, and shape set — the Mintlify-compatible primitive.

Badge is an inline status chip — a status, a version, a label that sits in a line of text or a header. It's the Mintlify-compatible primitive, with a broad colour, size, and shape set. Badges are inline-only and carry no knowledge face by design — they're presentational. For the editorial chip used across superlore pages, see Pill.

When to use it

Reach for a badge to tag something inline — beta next to a feature name, a version after a heading, a passing/blocked status in a row. Pick the colour by intent.

Props

PropTypeDefaultDescription
colorgray | violet | green | yellow | red | surfacegrayChip colour
sizexs | sm | md | lgmdChip size
shaperounded | pillroundedCorner style
iconstring | ReactNodeOptional leading icon
strokebooleanfalseOutline-only (transparent fill)
disabledbooleanfalseDim the chip

Live example

violet

passing

beta

blocked

v0.1.0

On this page

Built withsuperlore