Purple Void to Larb Gai color palette

3D203BPurple Void 62375FLong Passionate Night 3F5F77Atlantis 679B6ALeafy 88AECDOld World E2C7A9Larb Gai

Open in generator Export PNG, PDF, ASE…

About this palette

Purple Void to Larb Gai is a 6-color cool palette: #3D203B (Purple Void), #62375F (Long Passionate Night), #3F5F77 (Atlantis), #679B6A (Leafy), #88AECD (Old World), #E2C7A9 (Larb Gai). It mixes purple, blue, green, orange tones and feels cool overall. The strongest text pairing is #3D203B on #E2C7A9 with a contrast ratio of 8.84:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Purple Void	rgb(61, 32, 59)	hsl(304, 31%, 18%)
Long Passionate Night	rgb(98, 55, 95)	hsl(304, 28%, 30%)
Atlantis	rgb(63, 95, 119)	hsl(206, 31%, 36%)
Leafy	rgb(103, 155, 106)	hsl(123, 21%, 51%)
Old World	rgb(136, 174, 205)	hsl(207, 41%, 67%)
Larb Gai	rgb(226, 199, 169)	hsl(32, 50%, 77%)

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.

Aa8.84:1 Very good#3D203B on #E2C7A9
Aa8.84:1 Very good#E2C7A9 on #3D203B
Aa6.12:1 Good#3D203B on #88AECD
Aa6.12:1 Good#88AECD on #3D203B
Aa5.82:1 Good#62375F on #E2C7A9
Aa5.82:1 Good#E2C7A9 on #62375F
Aa4.41:1 Poor#3D203B on #679B6A
Aa4.41:1 Poor#679B6A on #3D203B

Color blindness preview

CSS variables

/* Purple Void to Larb Gai — https://swatchly.xyz/palette/3d203b-62375f-3f5f77-679b6a-88aecd-e2c7a9 */
:root {
  --purple-void: #3d203b;
  --long-passionate-night: #62375f;
  --atlantis: #3f5f77;
  --leafy: #679b6a;
  --old-world: #88aecd;
  --larb-gai: #e2c7a9;
}

Tailwind CSS v4

/* Purple Void to Larb Gai — https://swatchly.xyz/palette/3d203b-62375f-3f5f77-679b6a-88aecd-e2c7a9 */
@theme {
  --color-purple-void: #3d203b;
  --color-purple-void-50: #fff0fd;
  --color-purple-void-100: #fbe3f8;
  --color-purple-void-200: #e9cde6;
  --color-purple-void-300: #d5b5d2;
  --color-purple-void-400: #b693b2;
  --color-purple-void-500: #997696;
  --color-purple-void-600: #7c5c79;
  --color-purple-void-700: #62455f;
  --color-purple-void-800: #4b3349;
  --color-purple-void-900: #3d203b;
  --color-purple-void-950: #221521;
  --color-long-passionate-night: #62375f;
  --color-long-passionate-night-50: #fff0fd;
  --color-long-passionate-night-100: #ffe0fc;
  --color-long-passionate-night-200: #f0c9ec;
  --color-long-passionate-night-300: #ddb2d9;
  --color-long-passionate-night-400: #c192bd;
  --color-long-passionate-night-500: #a777a3;
  --color-long-passionate-night-600: #8c5e88;
  --color-long-passionate-night-700: #744a71;
  --color-long-passionate-night-800: #62375f;
  --color-long-passionate-night-900: #4b2b49;
  --color-long-passionate-night-950: #31192f;
  --color-atlantis: #3f5f77;
  --color-atlantis-50: #ecf7ff;
  --color-atlantis-100: #d9eeff;
  --color-atlantis-200: #c2ddf1;
  --color-atlantis-300: #aac7df;
  --color-atlantis-400: #89a9c3;
  --color-atlantis-500: #6d8fa9;
  --color-atlantis-600: #55758e;
  --color-atlantis-700: #3f5f77;
  --color-atlantis-800: #304a5e;
  --color-atlantis-900: #22394a;
  --color-atlantis-950: #132430;
  --color-leafy: #679b6a;
  --color-leafy-50: #e4ffe4;
  --color-leafy-100: #d7f8d8;
  --color-leafy-200: #c0e7c1;
  --color-leafy-300: #a6d3a8;
  --color-leafy-400: #83b586;
  --color-leafy-500: #679b6a;
  --color-leafy-600: #4c7f50;
  --color-leafy-700: #37653b;
  --color-leafy-800: #26502a;
  --color-leafy-900: #1a3e1e;
  --color-leafy-950: #0d2610;
  --color-old-world: #88aecd;
  --color-old-world-50: #f2f9ff;
  --color-old-world-100: #e2f2ff;
  --color-old-world-200: #c5e1f8;
  --color-old-world-300: #accce6;
  --color-old-world-400: #88aecd;
  --color-old-world-500: #6c91af;
  --color-old-world-600: #517591;
  --color-old-world-700: #3c5c76;
  --color-old-world-800: #2b485e;
  --color-old-world-900: #1e364a;
  --color-old-world-950: #10212f;
  --color-larb-gai: #e2c7a9;
  --color-larb-gai-50: #fffaf4;
  --color-larb-gai-100: #fff0e0;
  --color-larb-gai-200: #f0dec9;
  --color-larb-gai-300: #e2c7a9;
  --color-larb-gai-400: #bea68b;
  --color-larb-gai-500: #a1886c;
  --color-larb-gai-600: #846c51;
  --color-larb-gai-700: #6a543b;
  --color-larb-gai-800: #53402a;
  --color-larb-gai-900: #3f301d;
  --color-larb-gai-950: #281d10;
}