Pastel color palettes and soft color schemes
Palettes built around pastel. Click any swatch to copy its hex code.
Pastel colors are soft, light and low in saturation — the pale pinks, mints and lilacs that make an interface feel calm rather than loud. Every pastel palette below is four such shades chosen to sit together, with hex codes ready to copy.
No pastel palettes yet
Run npm run generate to build the dataset.
Named shades and close relatives
What makes a color pastel
A pastel is a hue with the volume turned down: high lightness, low chroma, but never so low that the hue disappears. That last part is what separates a pastel from a plain grey tint — pastel sky still reads as blue.
These palettes are generated in OKLCH rather than HSL, and the pastel preset holds lightness between 0.84 and 0.94 with chroma between 0.035 and 0.075 — which lands between 70% and 95% lightness in HSL. The OKLCH corridor is the one that matters: HSL lightness is not perceptually even, so a fixed HSL value gives a yellow that looks washed out beside a blue that still looks strong.
Pastels and contrast
This is where pastel schemes usually go wrong. The shades above score between roughly 1.36:1 and 1.43:1 against white — nowhere near the 4.5:1 WCAG AA requires for normal text, and short of the 3:1 needed for buttons, borders and icons. Pastel text on a white page is not a stylistic risk; it is unreadable for a large number of people.
Used as backgrounds they are excellent. Dark text on a pastel field has room to spare — black on pastel pink measures about 14.7:1. The working rule is pastels behind, dark ink in front, and one deep accent from the same hue family for anything that has to be noticed.
Where pastel palettes work
Wedding stationery, baby and nursery branding, wellness and skincare packaging, spring campaigns, children's books, and the soft empty states common in modern apps. The common thread is content that should feel approachable rather than urgent — which is also why pastels rarely suit an error state or a warning.
Contrast and readability
The contrast checker reports every level for a given pair and suggests the nearest passing shade on the same hue. The color picker builds this same scale from any color you paste in.
Pastel color questions
- What is a pastel color?
- A color with high lightness and low saturation — a hue softened by adding white, or more precisely one whose chroma is deliberately held down. The pastels here sit between 70% and 95% HSL lightness. What separates a pastel from a plain tint is that the hue stays identifiable.
- What colors go well with pastels?
- Other pastels of a similar lightness, which is why analogous and monochrome schemes dominate here. For contrast, pair a pastel field with one deep accent from the same hue family rather than a second bright color.
- Are pastel colors accessible?
- Not on their own. Pastels score around 1.4:1 against white, far below the 4.5:1 WCAG AA needs for normal text. They work as backgrounds, not as text or small UI elements. Dark text on a pastel background is fine.
- Are these pastel palettes free to use?
- Yes, for anything, including commercial and client work, with no attribution required. Colors cannot be owned: a palette is four numbers.
Related colors:powder blue, wisteria. See every shade on the colors index.