Colour pairings

Blush and Charcoal

Blush (#F4C2C2) paired with charcoal (#36454F). Below are both colours expanded into full 11-step ramps, generated in OKLCH for even lightness steps and gamut-mapped to sRGB. Copy the Tailwind v4 config for either, or open them in the generator to fine-tune.

Blush #F4C2C2
Charcoal #36454F
50#FDF3F2
100#F6E2E1
200#F4C2C2
300#DEADAD
400#CB9192
500#AF7677
600#936162
700#7A5255
800#5E4143
900#4C3638
950#231618
blush — Tailwind v4@theme
@theme {
  --color-blush-50: #fdf3f2;
  --color-blush-100: #f6e2e1;
  --color-blush-200: #f4c2c2;
  --color-blush-300: #deadad;
  --color-blush-400: #cb9192;
  --color-blush-500: #af7677;
  --color-blush-600: #936162;
  --color-blush-700: #7a5255;
  --color-blush-800: #5e4143;
  --color-blush-900: #4c3638;
  --color-blush-950: #231618;
}
50#F3F6F8
100#E2E9ED
200#CBD7E0
300#ACBECA
400#91A6B4
500#768B99
600#607380
700#52616A
800#404C52
900#36454F
950#161B1E
charcoal — Tailwind v4@theme
@theme {
  --color-charcoal-50: #f3f6f8;
  --color-charcoal-100: #e2e9ed;
  --color-charcoal-200: #cbd7e0;
  --color-charcoal-300: #acbeca;
  --color-charcoal-400: #91a6b4;
  --color-charcoal-500: #768b99;
  --color-charcoal-600: #607380;
  --color-charcoal-700: #52616a;
  --color-charcoal-800: #404c52;
  --color-charcoal-900: #36454f;
  --color-charcoal-950: #161b1e;
}

Aesthetic

Want this palette built into your site?

You bring the colours. You'll get a site that uses them properly, designed and built by the team at Aesthetic.

More combinations