Forbidden Passion to Dream Vapour color palette

64191BForbidden Passion 006D72Pine Scented Lagoon ACF6C1Ultra Mint 76A471Primavera D79DE9Dream Vapour

Open in generator Export PNG, PDF, ASE…

About this palette

Forbidden Passion to Dream Vapour is a 5-color cool, earthy palette: #64191B (Forbidden Passion), #006D72 (Pine Scented Lagoon), #ACF6C1 (Ultra Mint), #76A471 (Primavera), #D79DE9 (Dream Vapour). It mixes brown, turquoise, green, purple tones and feels cool overall. The strongest text pairing is #64191B on #ACF6C1 with a contrast ratio of 9.85:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Forbidden Passion	rgb(100, 25, 27)	hsl(358, 60%, 25%)
Pine Scented Lagoon	rgb(0, 109, 114)	hsl(183, 100%, 22%)
Ultra Mint	rgb(172, 246, 193)	hsl(137, 80%, 82%)
Primavera	rgb(118, 164, 113)	hsl(114, 22%, 54%)
Dream Vapour	rgb(215, 157, 233)	hsl(286, 63%, 76%)

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.85:1 Very good#64191B on #ACF6C1
Aa9.85:1 Very good#ACF6C1 on #64191B
Aa5.83:1 Good#64191B on #D79DE9
Aa5.83:1 Good#D79DE9 on #64191B
Aa4.87:1 Good#006D72 on #ACF6C1
Aa4.87:1 Good#ACF6C1 on #006D72
Aa4.31:1 Poor#64191B on #76A471
Aa4.31:1 Poor#76A471 on #64191B

Color blindness preview

CSS variables

/* Forbidden Passion to Dream Vapour — https://swatchly.xyz/palette/64191b-006d72-acf6c1-76a471-d79de9 */
:root {
  --forbidden-passion: #64191b;
  --pine-scented-lagoon: #006d72;
  --ultra-mint: #acf6c1;
  --primavera: #76a471;
  --dream-vapour: #d79de9;
}

Tailwind CSS v4

/* Forbidden Passion to Dream Vapour — https://swatchly.xyz/palette/64191b-006d72-acf6c1-76a471-d79de9 */
@theme {
  --color-forbidden-passion: #64191b;
  --color-forbidden-passion-50: #fff2f0;
  --color-forbidden-passion-100: #ffe4e2;
  --color-forbidden-passion-200: #ffc8c4;
  --color-forbidden-passion-300: #f7aaa5;
  --color-forbidden-passion-400: #db8884;
  --color-forbidden-passion-500: #c06d69;
  --color-forbidden-passion-600: #a35450;
  --color-forbidden-passion-700: #883f3d;
  --color-forbidden-passion-800: #702f2e;
  --color-forbidden-passion-900: #64191b;
  --color-forbidden-passion-950: #3d1413;
  --color-pine-scented-lagoon: #006d72;
  --color-pine-scented-lagoon-50: #dafdff;
  --color-pine-scented-lagoon-100: #c4f6f9;
  --color-pine-scented-lagoon-200: #abe6e9;
  --color-pine-scented-lagoon-300: #8ed3d7;
  --color-pine-scented-lagoon-400: #67b6bb;
  --color-pine-scented-lagoon-500: #479da1;
  --color-pine-scented-lagoon-600: #298388;
  --color-pine-scented-lagoon-700: #006d72;
  --color-pine-scented-lagoon-800: #00555a;
  --color-pine-scented-lagoon-900: #004245;
  --color-pine-scented-lagoon-950: #002a2c;
  --color-ultra-mint: #acf6c1;
  --color-ultra-mint-50: #cefad9;
  --color-ultra-mint-100: #acf6c1;
  --color-ultra-mint-200: #a7e0b7;
  --color-ultra-mint-300: #8dcc9f;
  --color-ultra-mint-400: #6aaf7f;
  --color-ultra-mint-500: #4e9565;
  --color-ultra-mint-600: #347b4d;
  --color-ultra-mint-700: #21643b;
  --color-ultra-mint-800: #124f2b;
  --color-ultra-mint-900: #083e1f;
  --color-ultra-mint-950: #022711;
  --color-primavera: #76a471;
  --color-primavera-50: #defadb;
  --color-primavera-100: #cff0cc;
  --color-primavera-200: #b6dbb1;
  --color-primavera-300: #9ac495;
  --color-primavera-400: #76a471;
  --color-primavera-500: #5d8a59;
  --color-primavera-600: #477142;
  --color-primavera-700: #355b31;
  --color-primavera-800: #274924;
  --color-primavera-900: #1c391a;
  --color-primavera-950: #10250e;
  --color-dream-vapour: #d79de9;
  --color-dream-vapour-50: #fae9ff;
  --color-dream-vapour-100: #f6d8ff;
  --color-dream-vapour-200: #e9bbf8;
  --color-dream-vapour-300: #d79de9;
  --color-dream-vapour-400: #b880c9;
  --color-dream-vapour-500: #9e66af;
  --color-dream-vapour-600: #834f93;
  --color-dream-vapour-700: #6b3c7a;
  --color-dream-vapour-800: #572d63;
  --color-dream-vapour-900: #452150;
  --color-dream-vapour-950: #2d1234;
}