Tailwind ColorSnap
Updated for Tailwind v4
Input Color
Nearest TW Color
Distance: 0.00

#3b82f6 - A mid-tone azure, notable for its bold character.

  • Commonly used for primary actions, links, and brand elements
  • You might recognize it from Facebook's primary brand color, Twitter's action buttons, LinkedIn's interactive elements, and PayPal's trust indicators

Top Matches

blue-500
Distance: 0.00
indigo-400
Distance: 7.89
indigo-500
Distance: 10.80
blue-600
Distance: 11.21
sky-600
Distance: 12.29

All green Shades

blue-50
blue-100
blue-200
blue-300
blue-400
blue-500
blue-600
blue-700
blue-800
blue-900
blue-950

Other Color Combinations

Monochromatic

Complementary

Analogous

Triadic

Complete Brand Palette

Primary brand color #3b82f6 / blue-500
Brand accent #146DFF / blue-600
Complementary accent #EFB960 / orange-300
Text & UI elements #1e293b / slate-800
Backgrounds & borders #e2e8f0 / slate-200

Accessibility Considerations

Blue-700 and darker meet WCAG AA on white backgrounds

Avoid blue text on red backgrounds

See all Tailwind colors