Tools
Color match
Drop in a color and get the companions you actually reach for while building: which text color to use on it, a version tuned for light and dark mode, a full tint/shade scale, and a few colors that pair well with it.
#3B82F6
Text contrast
Which text color to put on top of this, and whether it clears WCAG.
Light & dark mode
A version of this color tuned to stay legible on each background.
Lighter & darker
A 50–900 tint/shade scale, same hue and saturation throughout.
Pairs well with
Complementary, analogous and triadic companions.