aestheticcolours

Colour pairings

Emerald and Blush

Emerald (#10B981) paired with blush (#F4C2C2). 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.

Emerald #10B981
Blush #F4C2C2
50#E8FBF2
100#CDF2E0
200#A2E7C6
300#69D4A4
400#10B981
500#00A06E
600#008559
700#007148
800#115836
900#18472D
950#052011
emerald — Tailwind v4@theme
@theme {
  --color-emerald-50: #e8fbf2;
  --color-emerald-100: #cdf2e0;
  --color-emerald-200: #a2e7c6;
  --color-emerald-300: #69d4a4;
  --color-emerald-400: #10b981;
  --color-emerald-500: #00a06e;
  --color-emerald-600: #008559;
  --color-emerald-700: #007148;
  --color-emerald-800: #115836;
  --color-emerald-900: #18472d;
  --color-emerald-950: #052011;
}
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;
}

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