Blue vs Indigo for Hover States
Compare blue and indigo for interactive hover, focus, and active state colors.
Blue
#3b82f6
Classic interactive blue
Indigo
#6366f1
Purple-shifted interactive blue
Side-by-Side Comparison
| Aspect | Blue | Indigo |
|---|---|---|
| Familiarity | Universally understood as interactive | Modern, trendy, distinctive |
| Visual shift | Subtle, expected transition | More dramatic, eye-catching |
| Pairs well with | Blue primary buttons | Indigo or purple primaries |
| Use case | Table row hover, menu hover | Card hover, feature hover, pricing |
| Best For | Standard hover effects, safe choice | Modern hover effects, SaaS products |
Our Recommendation
Blue hover for conventional, expected interactions. Indigo hover for modern, distinctive interactive feedback.
Tailwind Classes
Blue
Background: bg-blue-500
Text: text-blue-500
Border: border-blue-500
Indigo
Background: bg-indigo-500
Text: text-indigo-500
Border: border-indigo-500
#interactive#blue#indigo#hover#comparison