Seaborn to Negishi Green color palette

About this palette

Seaborn to Negishi Green is a 5-color earthy, vintage palette: #8AC2AB (Seaborn), #5C5027 (Jungle Beat), #191F12 (Nightmare), #E3F8C6 (Kiwi Kiss), #8F8B45 (Negishi Green). It mixes turquoise, brown, gray, green, yellow tones and feels balanced overall. The strongest text pairing is #191F12 on #E3F8C6 with a contrast ratio of 14.85:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Seabornrgb(138, 194, 171)hsl(155, 31%, 65%)
Jungle Beatrgb(92, 80, 39)hsl(46, 40%, 26%)
Nightmarergb(25, 31, 18)hsl(88, 27%, 10%)
Kiwi Kissrgb(227, 248, 198)hsl(85, 78%, 87%)
Negishi Greenrgb(143, 139, 69)hsl(57, 35%, 42%)

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.85:1 Super#191F12 on #E3F8C6
  • Aa14.85:1 Super#E3F8C6 on #191F12
  • Aa8.33:1 Very good#8AC2AB on #191F12
  • Aa8.33:1 Very good#191F12 on #8AC2AB
  • Aa7.03:1 Very good#5C5027 on #E3F8C6
  • Aa7.03:1 Very good#E3F8C6 on #5C5027
  • Aa4.77:1 Good#191F12 on #8F8B45
  • Aa4.77:1 Good#8F8B45 on #191F12

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Seaborn to Negishi Green — https://swatchly.xyz/palette/8ac2ab-5c5027-191f12-e3f8c6-8f8b45 */
:root {
  --seaborn: #8ac2ab;
  --jungle-beat: #5c5027;
  --nightmare: #191f12;
  --kiwi-kiss: #e3f8c6;
  --negishi-green: #8f8b45;
}

Tailwind CSS v4

/* Seaborn to Negishi Green — https://swatchly.xyz/palette/8ac2ab-5c5027-191f12-e3f8c6-8f8b45 */
@theme {
  --color-seaborn: #8ac2ab;
  --color-seaborn-50: #d6f7e9;
  --color-seaborn-100: #c6ecdc;
  --color-seaborn-200: #abd8c5;
  --color-seaborn-300: #8ac2ab;
  --color-seaborn-400: #6ea48f;
  --color-seaborn-500: #558b76;
  --color-seaborn-600: #3e725e;
  --color-seaborn-700: #2c5c4a;
  --color-seaborn-800: #1f4a3a;
  --color-seaborn-900: #153b2e;
  --color-seaborn-950: #0a251b;
  --color-jungle-beat: #5c5027;
  --color-jungle-beat-50: #fdf5dc;
  --color-jungle-beat-100: #f3ebcf;
  --color-jungle-beat-200: #e0d7b5;
  --color-jungle-beat-300: #cabf99;
  --color-jungle-beat-400: #ab9f75;
  --color-jungle-beat-500: #8f8258;
  --color-jungle-beat-600: #73673f;
  --color-jungle-beat-700: #5c5027;
  --color-jungle-beat-800: #483e1e;
  --color-jungle-beat-900: #373014;
  --color-jungle-beat-950: #231d09;
  --color-nightmare: #191f12;
  --color-nightmare-50: #f2f7ed;
  --color-nightmare-100: #e8ede2;
  --color-nightmare-200: #d4dacd;
  --color-nightmare-300: #bdc4b5;
  --color-nightmare-400: #9da595;
  --color-nightmare-500: #818979;
  --color-nightmare-600: #666e5e;
  --color-nightmare-700: #505649;
  --color-nightmare-800: #3d4337;
  --color-nightmare-900: #2e3228;
  --color-nightmare-950: #191f12;
  --color-kiwi-kiss: #e3f8c6;
  --color-kiwi-kiss-50: #f2fde3;
  --color-kiwi-kiss-100: #e3f8c6;
  --color-kiwi-kiss-200: #d2e1be;
  --color-kiwi-kiss-300: #bacba2;
  --color-kiwi-kiss-400: #99ab7e;
  --color-kiwi-kiss-500: #7d8f61;
  --color-kiwi-kiss-600: #627448;
  --color-kiwi-kiss-700: #4c5c34;
  --color-kiwi-kiss-800: #3a4825;
  --color-kiwi-kiss-900: #2c381a;
  --color-kiwi-kiss-950: #1a230d;
  --color-negishi-green: #8f8b45;
  --color-negishi-green-50: #f9f8d1;
  --color-negishi-green-100: #f0efc3;
  --color-negishi-green-200: #dedca8;
  --color-negishi-green-300: #c8c68a;
  --color-negishi-green-400: #aaa664;
  --color-negishi-green-500: #8f8b45;
  --color-negishi-green-600: #74702a;
  --color-negishi-green-700: #5d5916;
  --color-negishi-green-800: #494506;
  --color-negishi-green-900: #383500;
  --color-negishi-green-950: #232100;
}

Similar palettes