Kiwi Kiss to Sunken Ship Color Palette

About this palette

Kiwi Kiss to Sunken Ship is a 5-color cool palette: #E7F7C5 (Kiwi Kiss), #B8ADD7 (Pastel Lilac), #BE7877 (Nipple), #445A28 (Turf), #12262A (Sunken Ship). It mixes green, purple, red, gray tones and feels cool overall. The strongest text pairing is #E7F7C5 on #12262A with a contrast ratio of 13.85:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Kiwi Kiss	rgb(231, 247, 197)	hsl(79, 76%, 87%)
Pastel Lilac	rgb(184, 173, 215)	hsl(256, 34%, 76%)
Nipple	rgb(190, 120, 119)	hsl(1, 35%, 61%)
Turf	rgb(68, 90, 40)	hsl(86, 38%, 25%)
Sunken Ship	rgb(18, 38, 42)	hsl(190, 40%, 12%)

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.

Aa13.85:1 Super#E7F7C5 on #12262A
Aa13.85:1 Super#12262A on #E7F7C5
Aa7.48:1 Very good#B8ADD7 on #12262A
Aa7.48:1 Very good#12262A on #B8ADD7
Aa6.76:1 Good#E7F7C5 on #445A28
Aa6.76:1 Good#445A28 on #E7F7C5
Aa4.60:1 Good#BE7877 on #12262A
Aa4.60:1 Good#12262A on #BE7877

Color blindness preview

CSS variables

/* Kiwi Kiss to Sunken Ship — https://swatchly.xyz/palette/e7f7c5-b8add7-be7877-445a28-12262a */
:root {
  --kiwi-kiss: #e7f7c5;
  --pastel-lilac: #b8add7;
  --nipple: #be7877;
  --turf: #445a28;
  --sunken-ship: #12262a;
}

Tailwind CSS v4

/* Kiwi Kiss to Sunken Ship — https://swatchly.xyz/palette/e7f7c5-b8add7-be7877-445a28-12262a */
@theme {
  --color-kiwi-kiss: #e7f7c5;
  --color-kiwi-kiss-50: #f4fde3;
  --color-kiwi-kiss-100: #e7f7c5;
  --color-kiwi-kiss-200: #d5e0bd;
  --color-kiwi-kiss-300: #bdcaa1;
  --color-kiwi-kiss-400: #9caa7d;
  --color-kiwi-kiss-500: #808e60;
  --color-kiwi-kiss-600: #667347;
  --color-kiwi-kiss-700: #4f5b33;
  --color-kiwi-kiss-800: #3d4724;
  --color-kiwi-kiss-900: #2e3719;
  --color-kiwi-kiss-950: #1c220c;
  --color-pastel-lilac: #b8add7;
  --color-pastel-lilac-50: #f0ebff;
  --color-pastel-lilac-100: #e5ddfb;
  --color-pastel-lilac-200: #d0c7e9;
  --color-pastel-lilac-300: #b8add7;
  --color-pastel-lilac-400: #9b90b8;
  --color-pastel-lilac-500: #82779e;
  --color-pastel-lilac-600: #695f84;
  --color-pastel-lilac-700: #554b6d;
  --color-pastel-lilac-800: #433b58;
  --color-pastel-lilac-900: #352e47;
  --color-pastel-lilac-950: #211c2e;
  --color-nipple: #be7877;
  --color-nipple-50: #fff3f3;
  --color-nipple-100: #ffe8e7;
  --color-nipple-200: #ffcecc;
  --color-nipple-300: #f3b4b2;
  --color-nipple-400: #d89392;
  --color-nipple-500: #be7877;
  --color-nipple-600: #9f5c5c;
  --color-nipple-700: #824646;
  --color-nipple-800: #693434;
  --color-nipple-900: #522626;
  --color-nipple-950: #351516;
  --color-turf: #445a28;
  --color-turf-50: #ecfbdd;
  --color-turf-100: #e1f2d0;
  --color-turf-200: #cbdfb6;
  --color-turf-300: #b2c99a;
  --color-turf-400: #91a976;
  --color-turf-500: #758d59;
  --color-turf-600: #5b7140;
  --color-turf-700: #445a28;
  --color-turf-800: #35461f;
  --color-turf-900: #283615;
  --color-turf-950: #17220a;
  --color-sunken-ship: #12262a;
  --color-sunken-ship-50: #ebf8fb;
  --color-sunken-ship-100: #dfeef2;
  --color-sunken-ship-200: #c9dbdf;
  --color-sunken-ship-300: #b1c5ca;
  --color-sunken-ship-400: #90a6ab;
  --color-sunken-ship-500: #758c90;
  --color-sunken-ship-600: #5c7276;
  --color-sunken-ship-700: #475b5f;
  --color-sunken-ship-800: #37484c;
  --color-sunken-ship-900: #2a393c;
  --color-sunken-ship-950: #12262a;
}