aestheticcolours

Colour pairings

Peach and Teal

Peach (#FFCBA4) paired with teal (#14B8A6). 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.

Peach #FFCBA4
Teal #14B8A6
50#FDF4EC
100#F7E4D4
200#FFCBA4
300#E2AF89
400#D09364
500#B37848
600#986238
700#7E5335
800#62412C
900#4F3627
950#25160D
peach — Tailwind v4@theme
@theme {
  --color-peach-50: #fdf4ec;
  --color-peach-100: #f7e4d4;
  --color-peach-200: #ffcba4;
  --color-peach-300: #e2af89;
  --color-peach-400: #d09364;
  --color-peach-500: #b37848;
  --color-peach-600: #986238;
  --color-peach-700: #7e5335;
  --color-peach-800: #62412c;
  --color-peach-900: #4f3627;
  --color-peach-950: #25160d;
}
50#E8FAF7
100#CDF0EA
200#A2E5DA
300#68D0C1
400#14B8A6
500#009D8D
600#008374
700#006E60
800#075649
900#13463C
950#032019
teal — Tailwind v4@theme
@theme {
  --color-teal-50: #e8faf7;
  --color-teal-100: #cdf0ea;
  --color-teal-200: #a2e5da;
  --color-teal-300: #68d0c1;
  --color-teal-400: #14b8a6;
  --color-teal-500: #009d8d;
  --color-teal-600: #008374;
  --color-teal-700: #006e60;
  --color-teal-800: #075649;
  --color-teal-900: #13463c;
  --color-teal-950: #032019;
}

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