Graphite to Manga Pink color palette

38351BGraphite 683B67Wine Tour 007480Prismarine 0092A1Oasis AC9F7AMohalla F5BBDBManga Pink

About this palette

Graphite to Manga Pink is a 6-color vintage palette: #38351B (Graphite), #683B67 (Wine Tour), #007480 (Prismarine), #0092A1 (Oasis), #AC9F7A (Mohalla), #F5BBDB (Manga Pink). It mixes brown, purple, turquoise, yellow, pink tones and feels balanced overall. The strongest text pairing is #38351B on #F5BBDB with a contrast ratio of 7.69:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Graphite	rgb(56, 53, 27)	hsl(54, 35%, 16%)
Wine Tour	rgb(104, 59, 103)	hsl(301, 28%, 32%)
Prismarine	rgb(0, 116, 128)	hsl(186, 100%, 25%)
Oasis	rgb(0, 146, 161)	hsl(186, 100%, 32%)
Mohalla	rgb(172, 159, 122)	hsl(44, 23%, 58%)
Manga Pink	rgb(245, 187, 219)	hsl(327, 74%, 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.

Aa7.69:1 Very good#38351B on #F5BBDB
Aa7.69:1 Very good#F5BBDB on #38351B
Aa5.40:1 Good#683B67 on #F5BBDB
Aa5.40:1 Good#F5BBDB on #683B67
Aa4.72:1 Good#38351B on #AC9F7A
Aa4.72:1 Good#AC9F7A on #38351B
Aa3.42:1 Poor#007480 on #F5BBDB
Aa3.42:1 Poor#F5BBDB on #007480

Color blindness preview

CSS variables

/* Graphite to Manga Pink — https://swatchly.xyz/palette/38351b-683b67-007480-0092a1-ac9f7a-f5bbdb */
:root {
  --graphite: #38351b;
  --wine-tour: #683b67;
  --prismarine: #007480;
  --oasis: #0092a1;
  --mohalla: #ac9f7a;
  --manga-pink: #f5bbdb;
}

Tailwind CSS v4

/* Graphite to Manga Pink — https://swatchly.xyz/palette/38351b-683b67-007480-0092a1-ac9f7a-f5bbdb */
@theme {
  --color-graphite: #38351b;
  --color-graphite-50: #f8f6e5;
  --color-graphite-100: #eeecd9;
  --color-graphite-200: #dbd9c2;
  --color-graphite-300: #c5c2a8;
  --color-graphite-400: #a6a387;
  --color-graphite-500: #8b886b;
  --color-graphite-600: #716e52;
  --color-graphite-700: #5a573e;
  --color-graphite-800: #47442e;
  --color-graphite-900: #38351b;
  --color-graphite-950: #222113;
  --color-wine-tour: #683b67;
  --color-wine-tour-50: #fff0fe;
  --color-wine-tour-100: #ffe0fd;
  --color-wine-tour-200: #efc7ed;
  --color-wine-tour-300: #daadd8;
  --color-wine-tour-400: #bb8ab9;
  --color-wine-tour-500: #9e6d9c;
  --color-wine-tour-600: #80537f;
  --color-wine-tour-700: #683b67;
  --color-wine-tour-800: #512e50;
  --color-wine-tour-900: #3f223f;
  --color-wine-tour-950: #281328;
  --color-prismarine: #007480;
  --color-prismarine-50: #e0fbff;
  --color-prismarine-100: #c0f5fd;
  --color-prismarine-200: #a2e2ec;
  --color-prismarine-300: #81ccd7;
  --color-prismarine-400: #56adb9;
  --color-prismarine-500: #32909c;
  --color-prismarine-600: #007480;
  --color-prismarine-700: #005c66;
  --color-prismarine-800: #004850;
  --color-prismarine-900: #00383e;
  --color-prismarine-950: #002327;
  --color-oasis: #0092a1;
  --color-oasis-50: #ddfbff;
  --color-oasis-100: #b9f6ff;
  --color-oasis-200: #96e4ef;
  --color-oasis-300: #71cedb;
  --color-oasis-400: #40afbd;
  --color-oasis-500: #0092a1;
  --color-oasis-600: #007682;
  --color-oasis-700: #005d68;
  --color-oasis-800: #004952;
  --color-oasis-900: #003940;
  --color-oasis-950: #002429;
  --color-mohalla: #ac9f7a;
  --color-mohalla-50: #fcf4df;
  --color-mohalla-100: #f2ead2;
  --color-mohalla-200: #e0d6b9;
  --color-mohalla-300: #cabf9e;
  --color-mohalla-400: #ac9f7a;
  --color-mohalla-500: #918460;
  --color-mohalla-600: #766a47;
  --color-mohalla-700: #5f5434;
  --color-mohalla-800: #4b4125;
  --color-mohalla-900: #3a321a;
  --color-mohalla-950: #251f0e;
  --color-manga-pink: #f5bbdb;
  --color-manga-pink-50: #ffe8f4;
  --color-manga-pink-100: #ffd7ec;
  --color-manga-pink-200: #f5bbdb;
  --color-manga-pink-300: #dba9c4;
  --color-manga-pink-400: #bf89a7;
  --color-manga-pink-500: #a46f8d;
  --color-manga-pink-600: #895774;
  --color-manga-pink-700: #70435d;
  --color-manga-pink-800: #5b334b;
  --color-manga-pink-900: #47263a;
  --color-manga-pink-950: #2e1624;
}