Green vs Emerald for Badges and Tags
Compare green and emerald for status badges, tags, and pill indicators.
Green
#22c55e
Bright, natural green
Emerald
#10b981
Sophisticated teal-green
Side-by-Side Comparison
| Aspect | Green | Emerald |
|---|---|---|
| Visibility | Bright, highly visible | Refined, less loud |
| Connotation | Active, available, go | Verified, trusted, premium |
| Pairs well with | White text, gray backgrounds | White text, dark backgrounds |
| Use case | Online status, open issues, active | Verified accounts, pro plans, certified |
| Best For | Active, online, open badges | Verified, premium, pro badges |
Our Recommendation
Green badges for active/online statuses. Emerald badges for verified/premium indicators.
Tailwind Classes
Green
Background: bg-green-500
Text: text-green-500
Border: border-green-500
Emerald
Background: bg-emerald-500
Text: text-emerald-500
Border: border-emerald-500
#badges#green#emerald#status#comparison