#0083AFCerulean
#FDFDFDWhite
#F9C5D1Bubblegum
#2E7D5BFern

Crimson Cerulean & Fern color palette

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Cerulean#0083AFrgb(0, 131, 175)hsl(195, 100%, 34%)oklch(57.2% 0.115 231)
White#FDFDFDrgb(253, 253, 253)hsl(0, 0%, 99%)oklch(99.4% 0.000 0)
Bubblegum#F9C5D1rgb(249, 197, 209)hsl(346, 81%, 87%)oklch(87.3% 0.061 3)
Fern#2E7D5Brgb(46, 125, 91)hsl(154, 46%, 34%)oklch(53.1% 0.095 162)

Why it works and how to use it

Crimson Cerulean & Fern is a complementary color palette tagged modern, blue, white. Near-complementary hues (about 168° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Cerulean takes the lead while the rest support. Lightness runs from 34% to 99%. Well suited to websites, presentations and branding.

  • Background: White (#FDFDFD) is the lightest color, so it belongs on large surfaces.
  • Text: Fern (#2E7D5B) on #FDFDFD gives 4.91:1, passing WCAG AA.
  • Primary: Cerulean (#0083AF) is the most saturated mid-tone; use it for buttons and links (4.24:1 against the background, fine for UI elements).
  • Accent: Bubblegum (#F9C5D1) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is White on Fern at 4.91:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Crimson Cerulean & Fern

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#0083AF
#FDFDFD
#F9C5D1
#2E7D5B

Color-blind check: under tritanopia, Cerulean and Fern become hard to tell apart, so do not rely on that pair alone to carry meaning.

Palette card

Crimson Cerulean & Fern color palette card: Cerulean #0083AF, White #FDFDFD, Bubblegum #F9C5D1, Fern #2E7D5B
Save or share Crimson Cerulean & Fern as an image with its hex codes.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#FDFDFD on #2E7D5BAa4.91:1AA
#0083AF on #FDFDFDAa4.24:1AA large only
#F9C5D1 on #2E7D5BAa3.32:1AA large only
#0083AF on #F9C5D1Aa2.86:1Fail
#FDFDFD on #F9C5D1Aa1.48:1Fail
#0083AF on #2E7D5BAa1.16:1Fail

Similar palettes 24 more in this mood