Start generating

Voracious White to Subnautical color palette

FFEEEBVoracious WhiteFFA88BFrozen Salmon869CF5Cold Lips00784CWoodland Soul004E1DMysterious Mixture0C1C4DSubnautical
Open in generator Export PNG, PDF, ASE…

About this palette

Voracious White to Subnautical is a 6-color cool palette: #FFEEEB (Voracious White), #FFA88B (Frozen Salmon), #869CF5 (Cold Lips), #00784C (Woodland Soul), #004E1D (Mysterious Mixture), #0C1C4D (Subnautical). It mixes white, pink, blue, green tones and feels cool overall. The strongest text pairing is #FFEEEB on #0C1C4D with a contrast ratio of 14.49:1, and 6 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Voracious Whitergb(255, 238, 235)hsl(9, 100%, 96%)
Frozen Salmonrgb(255, 168, 139)hsl(15, 100%, 77%)
Cold Lipsrgb(134, 156, 245)hsl(228, 85%, 74%)
Woodland Soulrgb(0, 120, 76)hsl(158, 100%, 24%)
Mysterious Mixturergb(0, 78, 29)hsl(142, 100%, 15%)
Subnauticalrgb(12, 28, 77)hsl(225, 73%, 17%)

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.

  • Aa14.49:1 Super#FFEEEB on #0C1C4D
  • Aa14.49:1 Super#0C1C4D on #FFEEEB
  • Aa8.86:1 Very good#FFEEEB on #004E1D
  • Aa8.86:1 Very good#004E1D on #FFEEEB
  • Aa8.71:1 Very good#FFA88B on #0C1C4D
  • Aa8.71:1 Very good#0C1C4D on #FFA88B
  • Aa6.27:1 Good#869CF5 on #0C1C4D
  • Aa6.27:1 Good#0C1C4D on #869CF5

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Voracious White to Subnautical — https://swatchly.xyz/palette/ffeeeb-ffa88b-869cf5-00784c-004e1d-0c1c4d */
:root {
  --voracious-white: #ffeeeb;
  --frozen-salmon: #ffa88b;
  --cold-lips: #869cf5;
  --woodland-soul: #00784c;
  --mysterious-mixture: #004e1d;
  --subnautical: #0c1c4d;
}

Tailwind CSS v4

/* Voracious White to Subnautical — https://swatchly.xyz/palette/ffeeeb-ffa88b-869cf5-00784c-004e1d-0c1c4d */
@theme {
  --color-voracious-white: #ffeeeb;
  --color-voracious-white-50: #ffeeeb;
  --color-voracious-white-100: #f1e6e4;
  --color-voracious-white-200: #dfd2d0;
  --color-voracious-white-300: #cabcb9;
  --color-voracious-white-400: #ac9d9a;
  --color-voracious-white-500: #91827f;
  --color-voracious-white-600: #766866;
  --color-voracious-white-700: #5f5250;
  --color-voracious-white-800: #4b3f3d;
  --color-voracious-white-900: #3a302f;
  --color-voracious-white-950: #241d1c;
  --color-frozen-salmon: #ffa88b;
  --color-frozen-salmon-50: #fff2ee;
  --color-frozen-salmon-100: #ffe5dc;
  --color-frozen-salmon-200: #ffcab8;
  --color-frozen-salmon-300: #ffa88b;
  --color-frozen-salmon-400: #db8a6f;
  --color-frozen-salmon-500: #be6d52;
  --color-frozen-salmon-600: #a05339;
  --color-frozen-salmon-700: #843e26;
  --color-frozen-salmon-800: #6a2e18;
  --color-frozen-salmon-900: #54210f;
  --color-frozen-salmon-950: #371206;
  --color-cold-lips: #869cf5;
  --color-cold-lips-50: #f2f5ff;
  --color-cold-lips-100: #e5ebff;
  --color-cold-lips-200: #cbd7ff;
  --color-cold-lips-300: #acbeff;
  --color-cold-lips-400: #869cf5;
  --color-cold-lips-500: #6c80d6;
  --color-cold-lips-600: #5365b7;
  --color-cold-lips-700: #3f4e99;
  --color-cold-lips-800: #2f3b7d;
  --color-cold-lips-900: #232d64;
  --color-cold-lips-950: #141a42;
  --color-woodland-soul: #00784c;
  --color-woodland-soul-50: #ddffeb;
  --color-woodland-soul-100: #c1f9d9;
  --color-woodland-soul-200: #a2e7c0;
  --color-woodland-soul-300: #81d1a6;
  --color-woodland-soul-400: #56b283;
  --color-woodland-soul-500: #329567;
  --color-woodland-soul-600: #00784c;
  --color-woodland-soul-700: #005f3b;
  --color-woodland-soul-800: #004b2e;
  --color-woodland-soul-900: #003a22;
  --color-woodland-soul-950: #002514;
  --color-mysterious-mixture: #004e1d;
  --color-mysterious-mixture-50: #dfffe3;
  --color-mysterious-mixture-100: #cef8d4;
  --color-mysterious-mixture-200: #b5e6bc;
  --color-mysterious-mixture-300: #98d1a1;
  --color-mysterious-mixture-400: #72b27d;
  --color-mysterious-mixture-500: #549661;
  --color-mysterious-mixture-600: #3a7a48;
  --color-mysterious-mixture-700: #266134;
  --color-mysterious-mixture-800: #004e1d;
  --color-mysterious-mixture-900: #0d3b1a;
  --color-mysterious-mixture-950: #05250d;
  --color-subnautical: #0c1c4d;
  --color-subnautical-50: #f1f5ff;
  --color-subnautical-100: #e2ebff;
  --color-subnautical-200: #c6d7ff;
  --color-subnautical-300: #a9c0f5;
  --color-subnautical-400: #87a0da;
  --color-subnautical-500: #6c85bf;
  --color-subnautical-600: #536ba2;
  --color-subnautical-700: #405487;
  --color-subnautical-800: #30426e;
  --color-subnautical-900: #243359;
  --color-subnautical-950: #0c1c4d;
}

Similar palettes