Start generating

Glimpse Into Space to Girlie color palette

08170EGlimpse Into Space2D2C61Galaxea007557Greasy Greens6B74C2FloodD39F91Indian MesaFFD0C8Girlie
Open in generator Export PNG, PDF, ASE…

About this palette

Glimpse Into Space to Girlie is a 6-color palette: #08170E (Glimpse Into Space), #2D2C61 (Galaxea), #007557 (Greasy Greens), #6B74C2 (Flood), #D39F91 (Indian Mesa), #FFD0C8 (Girlie). It mixes black, purple, turquoise, red, pink tones and feels cool overall. The strongest text pairing is #08170E on #FFD0C8 with a contrast ratio of 13.26:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Glimpse Into Spacergb(8, 23, 14)hsl(144, 48%, 6%)
Galaxeargb(45, 44, 97)hsl(241, 38%, 28%)
Greasy Greensrgb(0, 117, 87)hsl(165, 100%, 23%)
Floodrgb(107, 116, 194)hsl(234, 42%, 59%)
Indian Mesargb(211, 159, 145)hsl(13, 43%, 70%)
Girliergb(255, 208, 200)hsl(9, 100%, 89%)

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.26:1 Super#08170E on #FFD0C8
  • Aa13.26:1 Super#FFD0C8 on #08170E
  • Aa9.19:1 Very good#2D2C61 on #FFD0C8
  • Aa9.19:1 Very good#FFD0C8 on #2D2C61
  • Aa8.02:1 Very good#08170E on #D39F91
  • Aa8.02:1 Very good#D39F91 on #08170E
  • Aa5.56:1 Good#2D2C61 on #D39F91
  • Aa5.56:1 Good#D39F91 on #2D2C61

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Glimpse Into Space to Girlie — https://swatchly.xyz/palette/08170e-2d2c61-007557-6b74c2-d39f91-ffd0c8 */
:root {
  --glimpse-into-space: #08170e;
  --galaxea: #2d2c61;
  --greasy-greens: #007557;
  --flood: #6b74c2;
  --indian-mesa: #d39f91;
  --girlie: #ffd0c8;
}

Tailwind CSS v4

/* Glimpse Into Space to Girlie — https://swatchly.xyz/palette/08170e-2d2c61-007557-6b74c2-d39f91-ffd0c8 */
@theme {
  --color-glimpse-into-space: #08170e;
  --color-glimpse-into-space-50: #edf8f1;
  --color-glimpse-into-space-100: #e2efe6;
  --color-glimpse-into-space-200: #cddcd2;
  --color-glimpse-into-space-300: #b5c6bb;
  --color-glimpse-into-space-400: #95a79b;
  --color-glimpse-into-space-500: #77897d;
  --color-glimpse-into-space-600: #5b6c60;
  --color-glimpse-into-space-700: #435248;
  --color-glimpse-into-space-800: #303d35;
  --color-glimpse-into-space-900: #212b24;
  --color-glimpse-into-space-950: #08170e;
  --color-galaxea: #2d2c61;
  --color-galaxea-50: #f3f4ff;
  --color-galaxea-100: #e7e9ff;
  --color-galaxea-200: #d0d4ff;
  --color-galaxea-300: #b7bcf3;
  --color-galaxea-400: #989cd8;
  --color-galaxea-500: #7d80bd;
  --color-galaxea-600: #6366a0;
  --color-galaxea-700: #4e5084;
  --color-galaxea-800: #3c3e6c;
  --color-galaxea-900: #2d2c61;
  --color-galaxea-950: #1c1d39;
  --color-greasy-greens: #007557;
  --color-greasy-greens-50: #dbffef;
  --color-greasy-greens-100: #c1f8e1;
  --color-greasy-greens-200: #a2e5ca;
  --color-greasy-greens-300: #81cfb0;
  --color-greasy-greens-400: #56af8f;
  --color-greasy-greens-500: #329272;
  --color-greasy-greens-600: #007557;
  --color-greasy-greens-700: #005d44;
  --color-greasy-greens-800: #004935;
  --color-greasy-greens-900: #003928;
  --color-greasy-greens-950: #002418;
  --color-flood: #6b74c2;
  --color-flood-50: #f0f3ff;
  --color-flood-100: #e1e6ff;
  --color-flood-200: #c6cfff;
  --color-flood-300: #a9b4fd;
  --color-flood-400: #8791e0;
  --color-flood-500: #6b74c2;
  --color-flood-600: #545ba5;
  --color-flood-700: #414789;
  --color-flood-800: #323770;
  --color-flood-900: #262a5a;
  --color-flood-950: #17193d;
  --color-indian-mesa: #d39f91;
  --color-indian-mesa-50: #fff7f5;
  --color-indian-mesa-100: #ffede8;
  --color-indian-mesa-200: #fcd6cb;
  --color-indian-mesa-300: #ebbfb4;
  --color-indian-mesa-400: #d39f91;
  --color-indian-mesa-500: #b38274;
  --color-indian-mesa-600: #956559;
  --color-indian-mesa-700: #794e42;
  --color-indian-mesa-800: #603b31;
  --color-indian-mesa-900: #4a2b23;
  --color-indian-mesa-950: #2f1913;
  --color-girlie: #ffd0c8;
  --color-girlie-50: #fff6f5;
  --color-girlie-100: #ffeae7;
  --color-girlie-200: #ffd0c8;
  --color-girlie-300: #e1bbb4;
  --color-girlie-400: #c39992;
  --color-girlie-500: #a77d76;
  --color-girlie-600: #8a625b;
  --color-girlie-700: #704b46;
  --color-girlie-800: #583934;
  --color-girlie-900: #452b27;
  --color-girlie-950: #2c1a17;
}

Similar palettes