LightPeriwinkle
#C5CBE1 · rgb(197, 203, 225) · hsl(227, 32%, 83%)
Complementary colors
#c6cce2 · #e2dcc6Analogous colors
#c6dae2 · #c6cce2 · #cec6e2Triadic colors
#c6cce2 · #e2c6cc · #cce2c6Split-complementary colors
#c6cce2 · #e2cec6 · #dae2c6Tetradic colors
#c6cce2 · #e2c6da · #e2dcc6 · #c6e2ceMonochromatic colors
#1a1f32 · #37436c · #5768a8 · #939fc8 · #cdd2e5Ready-made palettes with LightPeriwinkle
Complementary palette
The base color paired with its opposite on the wheel for maximum contrast, plus two neutrals and a soft tint.
#C5CBE1 · #e2dcc6 · #ffffff · #f4f4f5 · #18181b
Analogous palette
Neighboring hues on the color wheel create a calm, cohesive scheme with a light tint and a deep shade.
#c6dae2 · #C5CBE1 · #cec6e2 · #ffffff · #7280b6
Triadic palette
Three hues spaced evenly around the wheel for a bold, balanced palette anchored by two neutrals.
#C5CBE1 · #e2c6cc · #cce2c6 · #f4f4f5 · #18181b
Monochromatic palette
A single hue stepped from light to dark for a clean, elegant and foolproof palette.
#f2f3f8 · #a7b1d2 · #5a6baa · #323d62 · #0a0d14
If you are wondering what colors go with LightPeriwinkle, start with its opposite on the wheel — a complementary #e2dcc6 — then soften the pairing with the analogous, triadic and monochromatic schemes above.
Frequently asked questions
LightPeriwinkle's complementary color is #e2dcc6. Analogous neighbors, triadic accents and monochromatic tints of the same hue all pair naturally with it too.
Good to 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.
From the blog
Guides that go deeper into what this tool does.

Rainbow Color Codes: Hex and RGB for Every Shade of the Spectrum
The real hex and RGB codes for all 7 ROYGBIV rainbow colors, why there's no single "official" rainbow, and CSS code to build your own rainbow gradient.

The 60-30-10 Rule: A Simple Formula for Color in Design
The 60-30-10 color rule explained — how to split any palette into a dominant, secondary, and accent color, with real hex codes and CSS for web design.

Tint vs. Shade vs. Tone: What's the Actual Difference?
Tint (+white), shade (+black), and tone (+gray) explained clearly — with a real hex example, CSS code, and where each one actually belongs in design.