What are the hex codes in the Bright Peach & Glacier palette?

The Bright Peach & Glacier color palette consists of Gunmetal #30343C, Dove Gray #667183, Glacier #BFDCFF, Peach #FFEEB4.

How should I use the Bright Peach & Glacier palette on a website?

Use Peach #FFEEB4 as the background, Gunmetal #30343C for text, Glacier #BFDCFF for buttons and links, and Dove Gray #667183 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Gunmetal on Peach at 10.78:1.

Which colors in Bright Peach & Glacier have enough contrast for text?

The highest-contrast pair is #30343C on #FFEEB4 with a ratio of 10.78:1, which passes WCAG AA for normal text.

#30343CGunmetal

#667183Dove Gray

#BFDCFFGlacier

#FFEEB4Peach

Bright Peach & Glacier color palette

Muted Minimal Gray Beige

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Gunmetal	`#30343C`	`rgb(48, 52, 60)`	`hsl(220, 11%, 21%)`	`oklch(32.4% 0.015 264)`
Dove Gray	`#667183`	`rgb(102, 113, 131)`	`hsl(217, 12%, 46%)`	`oklch(54.6% 0.031 260)`
Glacier	`#BFDCFF`	`rgb(191, 220, 255)`	`hsl(213, 100%, 87%)`	`oklch(88.5% 0.058 253)`
Peach	`#FFEEB4`	`rgb(255, 238, 180)`	`hsl(46, 100%, 85%)`	`oklch(94.9% 0.076 94)`

Why it works and how to use it

Bright Peach & Glacier is a complementary color palette tagged muted, minimal, gray. Glacier and Peach sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

Two of the four colors are near-neutral, which leaves room for Glacier to lead. Lightness runs from 21% to 87%. Well suited to websites, presentations and branding.

Background: Peach (#FFEEB4) is the lightest color, so it belongs on large surfaces.
Text: Gunmetal (#30343C) on #FFEEB4 gives 10.78:1, passing WCAG AAA.
Primary: Glacier (#BFDCFF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Dove Gray (#667183) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Gunmetal on Peach at 10.78:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Bright Peach & Glacier

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

#30343C

#667183

#BFDCFF

#FFEEB4

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
`#30343C` on `#FFEEB4`	Aa	10.78:1	AAA
`#30343C` on `#BFDCFF`	Aa	8.86:1	AAA
`#667183` on `#FFEEB4`	Aa	4.26:1	AA large only
`#667183` on `#BFDCFF`	Aa	3.5:1	AA large only
`#30343C` on `#667183`	Aa	2.53:1	Fail
`#BFDCFF` on `#FFEEB4`	Aa	1.22:1	Fail

:root {
  --gunmetal: #30343C;
  --dove-gray: #667183;
  --glacier: #BFDCFF;
  --peach: #FFEEB4;
}

$gunmetal: #30343C;
$dove-gray: #667183;
$glacier: #BFDCFF;
$peach: #FFEEB4;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'gunmetal': '#30343C',
        'dove-gray': '#667183',
        'glacier': '#BFDCFF',
        'peach': '#FFEEB4',
      },
    },
  },
};

{
  "name": "Bright Peach & Glacier",
  "colors": [
    "#30343C",
    "#667183",
    "#BFDCFF",
    "#FFEEB4"
  ]
}

background: linear-gradient(135deg, #30343C, #667183, #BFDCFF, #FFEEB4);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2024-10-05 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood