Sapphire
#0F52BA · rgb(15, 82, 186) · hsl(216, 85%, 39%)
Complementary colors
#0f53b8 · #b8740fAnalogous colors
#0fa7b8 · #0f53b8 · #200fb8Triadic colors
#0f53b8 · #b80f53 · #53b80fSplit-complementary colors
#0f53b8 · #b8200f · #a7b80fTetradic colors
#0f53b8 · #b80fa7 · #b8740f · #0fb820Monochromatic colors
#062047 · #0c4497 · #136aec · #68a0f3 · #b8d2f9Ready-made palettes with Sapphire
Complementary palette
The base color paired with its opposite on the wheel for maximum contrast, plus two neutrals and a soft tint.
#0F52BA · #b8740f · #5e95e8 · #f4f4f5 · #18181b
Analogous palette
Neighboring hues on the color wheel create a calm, cohesive scheme with a light tint and a deep shade.
#0fa7b8 · #0F52BA · #200fb8 · #5e95e8 · #051e42
Triadic palette
Three hues spaced evenly around the wheel for a bold, balanced palette anchored by two neutrals.
#0F52BA · #b80f53 · #53b80f · #f4f4f5 · #18181b
Monochromatic palette
A single hue stepped from light to dark for a clean, elegant and foolproof palette.
#ecf3fd · #84b1f5 · #186dec · #0b3d89 · #020d1c
If you are wondering what colors go with Sapphire, start with its opposite on the wheel — a complementary #b8740f — then soften the pairing with the analogous, triadic and monochromatic schemes above.
Frequently asked questions
Sapphire's complementary color is #b8740f. Analogous neighbors, triadic accents and monochromatic tints of the same hue all pair naturally with it too.
Must-know facts
- Every swatch row is a complete scheme you can copy straight into CSS.
- The color wheel can regenerate these harmonies for any base you like.
Related tools
These color tools pair naturally with the one you just used — keep exploring.