Celadon Porcelain

#7ebea5

Muted pastel blue-green porcelain for airy calm sections

Save
Share

About Celadon Porcelain

Celadon Porcelain sits right at the edge where teal tips into green, but it doesn't commit to either. It's lighter than and way less saturated than , the kind of color that feels like it's been through a wash cycle, softer without going pale. There's still real presence here, just gentler temperature control than its bluer neighbors.

Reach for this in health apps, design systems, and product interfaces where you need secondary surfaces that read as intentional. Think card backgrounds, subtle dividers, disabled states, anything that should feel considered but not draw focus. It pairs cleaner with warm grays than does because it hasn't got that punch, and it won't flatten the way sometimes does on darker screens. The slight green undertone keeps it from drifting toward pure gray-blue.

One thing: test it early on your actual background colors. It's light enough that monitor shifts will move it noticeably, and what reads fresh and cool on one display can tip slightly warmer on another. Pairs well with dark charcoal type and holds its own against mid-tone backgrounds without needing perfect contrast to land.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
2.14:1Fail

On Gray 100 #f5f5f5

Aa
1.97:1Fail

On Gray 900 #18181b

Aa
8.26:1AAA

On Black #000000

Aa
9.80:1AAA

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

#7cbbae
#8ebaa6
#85c2b2
#64bfa4
#7db39e

Create a gradient with Celadon Porcelain

Open the generator with this color pre-loaded.

Start creating