Pool Table to Royal Plum Color Palette

About this palette

Pool Table to Royal Plum is a 5-color cool, vintage palette: #2F9474 (Pool Table), #FFD8CC (Twinkle Pink), #003C28 (Queen of Trees), #59CCF7 (Thor’s Thunder), #663C58 (Royal Plum). It mixes turquoise, pink, green, blue, red tones and feels cool overall. The strongest text pairing is #FFD8CC on #003C28 with a contrast ratio of 9.51:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pool Table	rgb(47, 148, 116)	hsl(161, 52%, 38%)
Twinkle Pink	rgb(255, 216, 204)	hsl(14, 100%, 90%)
Queen of Trees	rgb(0, 60, 40)	hsl(160, 100%, 12%)
Thor’s Thunder	rgb(89, 204, 247)	hsl(196, 91%, 66%)
Royal Plum	rgb(102, 60, 88)	hsl(320, 26%, 32%)

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.

Aa9.51:1 Very good#FFD8CC on #003C28
Aa9.51:1 Very good#003C28 on #FFD8CC
Aa6.80:1 Good#003C28 on #59CCF7
Aa6.80:1 Good#59CCF7 on #003C28
Aa6.78:1 Good#FFD8CC on #663C58
Aa6.78:1 Good#663C58 on #FFD8CC
Aa4.85:1 Good#59CCF7 on #663C58
Aa4.85:1 Good#663C58 on #59CCF7

Color blindness preview

CSS variables

/* Pool Table to Royal Plum — https://swatchly.xyz/palette/2f9474-ffd8cc-003c28-59ccf7-663c58 */
:root {
  --pool-table: #2f9474;
  --twinkle-pink: #ffd8cc;
  --queen-of-trees: #003c28;
  --thor-s-thunder: #59ccf7;
  --royal-plum: #663c58;
}

Tailwind CSS v4

/* Pool Table to Royal Plum — https://swatchly.xyz/palette/2f9474-ffd8cc-003c28-59ccf7-663c58 */
@theme {
  --color-pool-table: #2f9474;
  --color-pool-table-50: #d6ffee;
  --color-pool-table-100: #bef8e0;
  --color-pool-table-200: #a0e6ca;
  --color-pool-table-300: #7fd0b1;
  --color-pool-table-400: #54b190;
  --color-pool-table-500: #2f9474;
  --color-pool-table-600: #07795c;
  --color-pool-table-700: #006148;
  --color-pool-table-800: #004c38;
  --color-pool-table-900: #003b2b;
  --color-pool-table-950: #00261a;
  --color-twinkle-pink: #ffd8cc;
  --color-twinkle-pink-50: #ffe8e0;
  --color-twinkle-pink-100: #ffd8cc;
  --color-twinkle-pink-200: #e6c8bf;
  --color-twinkle-pink-300: #d4b2a8;
  --color-twinkle-pink-400: #b79489;
  --color-twinkle-pink-500: #9d7a6f;
  --color-twinkle-pink-600: #826257;
  --color-twinkle-pink-700: #6b4d44;
  --color-twinkle-pink-800: #553b33;
  --color-twinkle-pink-900: #432d26;
  --color-twinkle-pink-950: #2a1b16;
  --color-queen-of-trees: #003c28;
  --color-queen-of-trees-50: #e0feee;
  --color-queen-of-trees-100: #d3f5e4;
  --color-queen-of-trees-200: #bae2cf;
  --color-queen-of-trees-300: #9fcdb7;
  --color-queen-of-trees-400: #7bae96;
  --color-queen-of-trees-500: #5e937b;
  --color-queen-of-trees-600: #457761;
  --color-queen-of-trees-700: #305f4b;
  --color-queen-of-trees-800: #214b39;
  --color-queen-of-trees-900: #003c28;
  --color-queen-of-trees-950: #0a2419;
  --color-thor-s-thunder: #59ccf7;
  --color-thor-s-thunder-50: #e3f7ff;
  --color-thor-s-thunder-100: #caefff;
  --color-thor-s-thunder-200: #95e0ff;
  --color-thor-s-thunder-300: #59ccf7;
  --color-thor-s-thunder-400: #3aacd5;
  --color-thor-s-thunder-500: #0091b9;
  --color-thor-s-thunder-600: #007596;
  --color-thor-s-thunder-700: #005d78;
  --color-thor-s-thunder-800: #00495f;
  --color-thor-s-thunder-900: #00394b;
  --color-thor-s-thunder-950: #002330;
  --color-royal-plum: #663c58;
  --color-royal-plum-50: #fff0f9;
  --color-royal-plum-100: #ffe1f4;
  --color-royal-plum-200: #efc9e1;
  --color-royal-plum-300: #daaeca;
  --color-royal-plum-400: #ba8caa;
  --color-royal-plum-500: #9d6f8d;
  --color-royal-plum-600: #7f5470;
  --color-royal-plum-700: #663c58;
  --color-royal-plum-800: #4f2f44;
  --color-royal-plum-900: #3e2335;
  --color-royal-plum-950: #271421;
}