Goldfrapp to Pāua Color Palette

About this palette

Goldfrapp to Pāua is a 4-color vintage palette: #C9BA8D (Goldfrapp), #00B0D0 (Aquarius), #764C3A (Cheeky Chestnut), #29284A (Pāua). It mixes yellow, blue, brown, purple tones and feels balanced overall. The strongest text pairing is #C9BA8D on #29284A with a contrast ratio of 7.28:1, and 2 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Goldfrapp	rgb(201, 186, 141)	hsl(45, 36%, 67%)
Aquarius	rgb(0, 176, 208)	hsl(189, 100%, 41%)
Cheeky Chestnut	rgb(118, 76, 58)	hsl(18, 34%, 35%)
Pāua	rgb(41, 40, 74)	hsl(242, 30%, 22%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa7.28:1 Very good#C9BA8D on #29284A
Aa7.28:1 Very good#29284A on #C9BA8D
Aa5.43:1 Good#00B0D0 on #29284A
Aa5.43:1 Good#29284A on #00B0D0
Aa3.80:1 Poor#C9BA8D on #764C3A
Aa3.80:1 Poor#764C3A on #C9BA8D

Color blindness preview

CSS variables

/* Goldfrapp to Pāua — https://swatchly.xyz/palette/c9ba8d-00b0d0-764c3a-29284a */
:root {
  --goldfrapp: #c9ba8d;
  --aquarius: #00b0d0;
  --cheeky-chestnut: #764c3a;
  --p-ua: #29284a;
}

Tailwind CSS v4

/* Goldfrapp to Pāua — https://swatchly.xyz/palette/c9ba8d-00b0d0-764c3a-29284a */
@theme {
  --color-goldfrapp: #c9ba8d;
  --color-goldfrapp-50: #faf2d7;
  --color-goldfrapp-100: #f0e7c9;
  --color-goldfrapp-200: #ddd2af;
  --color-goldfrapp-300: #c9ba8d;
  --color-goldfrapp-400: #aa9c71;
  --color-goldfrapp-500: #908156;
  --color-goldfrapp-600: #76683f;
  --color-goldfrapp-700: #5f532d;
  --color-goldfrapp-800: #4b411f;
  --color-goldfrapp-900: #3b3215;
  --color-goldfrapp-950: #251f0a;
  --color-aquarius: #00b0d0;
  --color-aquarius-50: #e2f8ff;
  --color-aquarius-100: #c5f2ff;
  --color-aquarius-200: #89e5fd;
  --color-aquarius-300: #60cfeb;
  --color-aquarius-400: #00b0d0;
  --color-aquarius-500: #0093ae;
  --color-aquarius-600: #00768c;
  --color-aquarius-700: #005e70;
  --color-aquarius-800: #004a58;
  --color-aquarius-900: #003945;
  --color-aquarius-950: #00242d;
  --color-cheeky-chestnut: #764c3a;
  --color-cheeky-chestnut-50: #fff2ed;
  --color-cheeky-chestnut-100: #ffe5da;
  --color-cheeky-chestnut-200: #f4cfbf;
  --color-cheeky-chestnut-300: #e1b7a6;
  --color-cheeky-chestnut-400: #c59784;
  --color-cheeky-chestnut-500: #a97c69;
  --color-cheeky-chestnut-600: #8d6250;
  --color-cheeky-chestnut-700: #764c3a;
  --color-cheeky-chestnut-800: #5d3b2c;
  --color-cheeky-chestnut-900: #492c20;
  --color-cheeky-chestnut-950: #2f1a11;
  --color-p-ua: #29284a;
  --color-p-ua-50: #f3f4ff;
  --color-p-ua-100: #e8e9ff;
  --color-p-ua-200: #d3d4f5;
  --color-p-ua-300: #bcbde2;
  --color-p-ua-400: #9b9cc4;
  --color-p-ua-500: #7e7fa8;
  --color-p-ua-600: #63648a;
  --color-p-ua-700: #4d4d6f;
  --color-p-ua-800: #393a56;
  --color-p-ua-900: #29284a;
  --color-p-ua-950: #191929;
}