What are the hex codes in the Cranberry & Cerulean Glow palette?

The Cranberry & Cerulean Glow color palette consists of Cerulean #00709E, Cranberry #912219, Papaya #FDF0D5, Prussian Blue #003049.

How should I use the Cranberry & Cerulean Glow palette on a website?

Use Papaya #FDF0D5 as the background, Prussian Blue #003049 for text, Cerulean #00709E for buttons and links, and Cranberry #912219 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Papaya on Prussian Blue at 12.25:1.

Which colors in Cranberry & Cerulean Glow have enough contrast for text?

The highest-contrast pair is #FDF0D5 on #003049 with a ratio of 12.25:1, which passes WCAG AA for normal text.

#00709ECerulean

#912219Cranberry

#FDF0D5Papaya

#003049Prussian Blue

Cranberry & Cerulean Glow color palette

Dark Blue Red

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Cerulean	`#00709E`	`rgb(0, 112, 158)`	`hsl(197, 100%, 31%)`	`oklch(51.5% 0.111 236)`
Cranberry	`#912219`	`rgb(145, 34, 25)`	`hsl(5, 71%, 33%)`	`oklch(43.4% 0.148 29)`
Papaya	`#FDF0D5`	`rgb(253, 240, 213)`	`hsl(40, 91%, 91%)`	`oklch(95.8% 0.038 85)`
Prussian Blue	`#003049`	`rgb(0, 48, 73)`	`hsl(201, 100%, 14%)`	`oklch(29.4% 0.066 238)`

Why it works and how to use it

Cranberry & Cerulean Glow is a vivid complementary color palette tagged dark, blue, red. Cerulean and Prussian Blue sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. These are bold, punchy colors that need generous white space around them. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Cerulean takes the lead while the rest support. Lightness runs from 14% to 91%. Well suited to websites, presentations and branding.

Background: Papaya (#FDF0D5) is the lightest color, so it belongs on large surfaces.
Text: Prussian Blue (#003049) on #FDF0D5 gives 12.25:1, passing WCAG AAA.
Primary: Cerulean (#00709E) is the most saturated mid-tone; use it for buttons and links (4.88:1 against the background, fine for UI elements).
Accent: Cranberry (#912219) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Papaya on Prussian Blue at 12.25:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Cranberry & Cerulean Glow

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

Roles are assigned by lightness.

Color blindness simulation

#00709E

#912219

#FDF0D5

#003049

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#FDF0D5` on `#003049`	Aa	12.25:1	AAA
`#912219` on `#FDF0D5`	Aa	7.6:1	AAA
`#00709E` on `#FDF0D5`	Aa	4.88:1	AA
`#00709E` on `#003049`	Aa	2.51:1	Fail
`#912219` on `#003049`	Aa	1.61:1	Fail
`#00709E` on `#912219`	Aa	1.56:1	Fail

:root {
  --cerulean: #00709E;
  --cranberry: #912219;
  --papaya: #FDF0D5;
  --prussian-blue: #003049;
}

$cerulean: #00709E;
$cranberry: #912219;
$papaya: #FDF0D5;
$prussian-blue: #003049;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'cerulean': '#00709E',
        'cranberry': '#912219',
        'papaya': '#FDF0D5',
        'prussian-blue': '#003049',
      },
    },
  },
};

{
  "name": "Cranberry & Cerulean Glow",
  "colors": [
    "#00709E",
    "#912219",
    "#FDF0D5",
    "#003049"
  ]
}

background: linear-gradient(135deg, #00709E, #912219, #FDF0D5, #003049);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2025-01-01 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood