Nightmare to Violet Heaven color palette

161B01Nightmare 044959Nocturnal Expedition 606A28Bimi Green A06649Argan Oil C9926AButterum C4BEF5Violet Heaven

Open in generator Export PNG, PDF, ASE…

About this palette

Nightmare to Violet Heaven is a 6-color cool, earthy palette: #161B01 (Nightmare), #044959 (Nocturnal Expedition), #606A28 (Bimi Green), #A06649 (Argan Oil), #C9926A (Butterum), #C4BEF5 (Violet Heaven). It mixes green, blue, brown, orange, purple tones and feels cool overall. The strongest text pairing is #161B01 on #C4BEF5 with a contrast ratio of 10.10:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Nightmare	rgb(22, 27, 1)	hsl(72, 93%, 5%)
Nocturnal Expedition	rgb(4, 73, 89)	hsl(191, 91%, 18%)
Bimi Green	rgb(96, 106, 40)	hsl(69, 45%, 29%)
Argan Oil	rgb(160, 102, 73)	hsl(20, 37%, 46%)
Butterum	rgb(201, 146, 106)	hsl(25, 47%, 60%)
Violet Heaven	rgb(196, 190, 245)	hsl(247, 73%, 85%)

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.

Aa10.10:1 Very good#161B01 on #C4BEF5
Aa10.10:1 Very good#C4BEF5 on #161B01
Aa6.55:1 Good#161B01 on #C9926A
Aa6.55:1 Good#C9926A on #161B01
Aa5.72:1 Good#044959 on #C4BEF5
Aa5.72:1 Good#C4BEF5 on #044959
Aa3.77:1 Poor#161B01 on #A06649
Aa3.77:1 Poor#A06649 on #161B01

Color blindness preview

CSS variables

/* Nightmare to Violet Heaven — https://swatchly.xyz/palette/161b01-044959-606a28-a06649-c9926a-c4bef5 */
:root {
  --nightmare: #161b01;
  --nocturnal-expedition: #044959;
  --bimi-green: #606a28;
  --argan-oil: #a06649;
  --butterum: #c9926a;
  --violet-heaven: #c4bef5;
}

Tailwind CSS v4

/* Nightmare to Violet Heaven — https://swatchly.xyz/palette/161b01-044959-606a28-a06649-c9926a-c4bef5 */
@theme {
  --color-nightmare: #161b01;
  --color-nightmare-50: #f3f8e5;
  --color-nightmare-100: #e9eed9;
  --color-nightmare-200: #d5dbc2;
  --color-nightmare-300: #bec5a8;
  --color-nightmare-400: #9ea686;
  --color-nightmare-500: #818969;
  --color-nightmare-600: #666d4f;
  --color-nightmare-700: #4e553a;
  --color-nightmare-800: #3b4029;
  --color-nightmare-900: #2b2f1c;
  --color-nightmare-950: #161b01;
  --color-nocturnal-expedition: #044959;
  --color-nocturnal-expedition-50: #e6f9ff;
  --color-nocturnal-expedition-100: #cef2fe;
  --color-nocturnal-expedition-200: #b4e0ee;
  --color-nocturnal-expedition-300: #98cada;
  --color-nocturnal-expedition-400: #73abbc;
  --color-nocturnal-expedition-500: #558fa1;
  --color-nocturnal-expedition-600: #3b7485;
  --color-nocturnal-expedition-700: #275c6b;
  --color-nocturnal-expedition-800: #044959;
  --color-nocturnal-expedition-900: #0e3843;
  --color-nocturnal-expedition-950: #05232b;
  --color-bimi-green: #606a28;
  --color-bimi-green-50: #f2fad5;
  --color-bimi-green-100: #e6efc4;
  --color-bimi-green-200: #d1dba8;
  --color-bimi-green-300: #b8c389;
  --color-bimi-green-400: #97a363;
  --color-bimi-green-500: #7b8644;
  --color-bimi-green-600: #606a28;
  --color-bimi-green-700: #4c541a;
  --color-bimi-green-800: #3b420d;
  --color-bimi-green-900: #2d3306;
  --color-bimi-green-950: #1b2002;
  --color-argan-oil: #a06649;
  --color-argan-oil-50: #fff2ec;
  --color-argan-oil-100: #ffe8dd;
  --color-argan-oil-200: #ffd0b9;
  --color-argan-oil-300: #efb99f;
  --color-argan-oil-400: #d49a7d;
  --color-argan-oil-500: #bb7f62;
  --color-argan-oil-600: #a06649;
  --color-argan-oil-700: #834e33;
  --color-argan-oil-800: #6a3b23;
  --color-argan-oil-900: #532c17;
  --color-argan-oil-950: #36190a;
  --color-butterum: #c9926a;
  --color-butterum-50: #fff2e8;
  --color-butterum-100: #ffe4d2;
  --color-butterum-200: #f8ccad;
  --color-butterum-300: #e5b491;
  --color-butterum-400: #c9926a;
  --color-butterum-500: #ac7750;
  --color-butterum-600: #905d37;
  --color-butterum-700: #754825;
  --color-butterum-800: #5e3717;
  --color-butterum-900: #4b290e;
  --color-butterum-950: #301805;
  --color-violet-heaven: #c4bef5;
  --color-violet-heaven-50: #f7f6ff;
  --color-violet-heaven-100: #eeecff;
  --color-violet-heaven-200: #dad6fe;
  --color-violet-heaven-300: #c4bef5;
  --color-violet-heaven-400: #a49ed1;
  --color-violet-heaven-500: #8882b5;
  --color-violet-heaven-600: #6d6697;
  --color-violet-heaven-700: #56507c;
  --color-violet-heaven-800: #423d63;
  --color-violet-heaven-900: #322d4e;
  --color-violet-heaven-950: #1f1b33;
}