Badge
Beam Badge 2.0. Source in Figma: 2.0/Badge.
Status and label chips with a soft tint fill and matching border. Use Pill for fully rounded tags, Rounded for slightly rounded corners, and Elevated (Gray) when you want a surface fill with a light shadow.
Type
Beam Badge 2.0 types at Small · Gray. Pill and Rounded share the color system; Elevated is a surface treatment.
Pill
Fully rounded. Soft tint fill with a matching border.
LabelRounded
Slightly rounded corners. Same color system as Pill.
LabelElevated
Surface fill, slightly rounded corners, and a light shadow. Gray only in Beam.
LabelSize
Small, Medium, and Large on Pill · Brand.
Small · Label sm · 16 icon
LabelMedium · Label · 16 icon
LabelLarge · Label lg · 20 icon
LabelSlots
Optional leading and trailing icon slots. Shown on Medium · Rounded · Brand.
Color
All Beam colors at Small. Pill and Rounded for every tone; Elevated is Gray only.
Sizes × colors
Pill across Small, Medium, and Large for every tone.