Badges
Default
SendGrid Blue
Slate
Ron Burgundy
Burnt Orange
Carrot
Mango
Mantis
Spruce
Grass Stain
Lime
Cobalt
Bluebird
Seafoam
Caribbean
Crown
Screample
Sangria
Lavender
Wild Strawberry
Steel
Beta
New
Required | .badge |
Modifiers | .sg-blue .slate .ron-burgundy .burnt-orange .carrot .mango .mantis .spruce .grass-stain .lime .cobalt .bluebird .seafoam .caribbean .crown .screample .sangria .lavender .wild-strawberry .steel .is-beta .is-new .is-small .is-subtle |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<span class="badge">Default</span> | |
<span class="badge sg-blue">SendGrid Blue</span> | |
<span class="badge slate">Slate</span> | |
<span class="badge ron-burgundy">Ron Burgundy</span> | |
<span class="badge burnt-orange">Burnt Orange</span> | |
<span class="badge carrot">Carrot</span> | |
<span class="badge mango">Mango</span> | |
<span class="badge mantis">Mantis</span> | |
<span class="badge spruce">Spruce</span> | |
<span class="badge grass-stain">Grass Stain</span> | |
<span class="badge lime">Lime</span> | |
<span class="badge cobalt">Cobalt</span> | |
<span class="badge bluebird">Bluebird</span> | |
<span class="badge seafoam">Seafoam</span> | |
<span class="badge caribbean">Caribbean</span> | |
<span class="badge crown">Crown</span> | |
<span class="badge screample">Screample</span> | |
<span class="badge sangria">Sangria</span> | |
<span class="badge lavender">Lavender</span> | |
<span class="badge wild-strawberry">Wild Strawberry</span> | |
<span class="badge steel">Steel</span> | |
<span class="badge is-beta">Beta</span> | |
<span class="badge is-new">New</span> |
Guidelines
- Labels should be uppercase and ≤ 20 characters long.
- Avoid using Mango, Lime, and Caribbean colors except in situations where all other colors are in use.

