Yellow vs Amber: Sunshine vs Golden Warmth
Compare Tailwind's yellow and amber for highlights, ratings, and warm UI elements.
Yellow
#eab308
Pure bright yellow
Amber
#f59e0b
Orange-shifted golden
Side-by-Side Comparison
| Aspect | Yellow | Amber |
|---|---|---|
| Undertone | Pure, bright | Deeper, golden |
| Mood | Cheerful, sunny, alert | Warm, premium, cautionary |
| Accessibility | Worst contrast on light | Better contrast than yellow |
| Use case | Search highlights, emoji accents | Five-star ratings, premium plans |
| Best For | Text highlights, emoji, attention | Star ratings, warnings, badges |
Our Recommendation
Yellow for small highlights on dark backgrounds. Amber for readable warm accents and rating systems.
Tailwind Classes
Yellow
Background: bg-yellow-500
Text: text-yellow-500
Border: border-yellow-500
Amber
Background: bg-amber-500
Text: text-amber-500
Border: border-amber-500
#yellows#yellow#amber#warm#comparison