Green Commando to Bellini color palette

797D2EGreen Commando CB9A83Beauty and the Beach 5A498BSumptuous Purple 00374BSea of Stars F9C7ADBellini

Open in generator Export PNG, PDF, ASE…

About this palette

Green Commando to Bellini is a 5-color warm, earthy, vintage palette: #797D2E (Green Commando), #CB9A83 (Beauty and the Beach), #5A498B (Sumptuous Purple), #00374B (Sea of Stars), #F9C7AD (Bellini). It mixes yellow, orange, purple, blue tones and feels warm overall. The strongest text pairing is #00374B on #F9C7AD with a contrast ratio of 8.37:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Green Commando	rgb(121, 125, 46)	hsl(63, 46%, 34%)
Beauty and the Beach	rgb(203, 154, 131)	hsl(19, 41%, 65%)
Sumptuous Purple	rgb(90, 73, 139)	hsl(255, 31%, 42%)
Sea of Stars	rgb(0, 55, 75)	hsl(196, 100%, 15%)
Bellini	rgb(249, 199, 173)	hsl(21, 86%, 83%)

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.37:1 Very good#00374B on #F9C7AD
Aa8.37:1 Very good#F9C7AD on #00374B
Aa5.15:1 Good#CB9A83 on #00374B
Aa5.15:1 Good#00374B on #CB9A83
Aa5.00:1 Good#5A498B on #F9C7AD
Aa5.00:1 Good#F9C7AD on #5A498B
Aa3.08:1 Poor#CB9A83 on #5A498B
Aa3.08:1 Poor#5A498B on #CB9A83

Color blindness preview

CSS variables

/* Green Commando to Bellini — https://swatchly.xyz/palette/797d2e-cb9a83-5a498b-00374b-f9c7ad */
:root {
  --green-commando: #797d2e;
  --beauty-and-the-beach: #cb9a83;
  --sumptuous-purple: #5a498b;
  --sea-of-stars: #00374b;
  --bellini: #f9c7ad;
}

Tailwind CSS v4

/* Green Commando to Bellini — https://swatchly.xyz/palette/797d2e-cb9a83-5a498b-00374b-f9c7ad */
@theme {
  --color-green-commando: #797d2e;
  --color-green-commando-50: #f5facf;
  --color-green-commando-100: #eef2c3;
  --color-green-commando-200: #dce1aa;
  --color-green-commando-300: #c8cd8d;
  --color-green-commando-400: #abb067;
  --color-green-commando-500: #929649;
  --color-green-commando-600: #797d2e;
  --color-green-commando-700: #606315;
  --color-green-commando-800: #4b4e01;
  --color-green-commando-900: #393b00;
  --color-green-commando-950: #232500;
  --color-beauty-and-the-beach: #cb9a83;
  --color-beauty-and-the-beach-50: #fff4f0;
  --color-beauty-and-the-beach-100: #ffe9de;
  --color-beauty-and-the-beach-200: #f8d2c1;
  --color-beauty-and-the-beach-300: #e5bba7;
  --color-beauty-and-the-beach-400: #cb9a83;
  --color-beauty-and-the-beach-500: #ad7e68;
  --color-beauty-and-the-beach-600: #90634e;
  --color-beauty-and-the-beach-700: #754c39;
  --color-beauty-and-the-beach-800: #5d3a29;
  --color-beauty-and-the-beach-900: #492b1d;
  --color-beauty-and-the-beach-950: #2e190f;
  --color-sumptuous-purple: #5a498b;
  --color-sumptuous-purple-50: #f5f3ff;
  --color-sumptuous-purple-100: #ece8ff;
  --color-sumptuous-purple-200: #d9d0ff;
  --color-sumptuous-purple-300: #c4b7f7;
  --color-sumptuous-purple-400: #a596dc;
  --color-sumptuous-purple-500: #8a7ac1;
  --color-sumptuous-purple-600: #7060a3;
  --color-sumptuous-purple-700: #5a498b;
  --color-sumptuous-purple-800: #46386e;
  --color-sumptuous-purple-900: #362a57;
  --color-sumptuous-purple-950: #22193a;
  --color-sea-of-stars: #00374b;
  --color-sea-of-stars-50: #eaf8ff;
  --color-sea-of-stars-100: #d4f0ff;
  --color-sea-of-stars-200: #b9def0;
  --color-sea-of-stars-300: #9ec8dd;
  --color-sea-of-stars-400: #7aa9c0;
  --color-sea-of-stars-500: #5d8da4;
  --color-sea-of-stars-600: #437288;
  --color-sea-of-stars-700: #2f5a6e;
  --color-sea-of-stars-800: #204658;
  --color-sea-of-stars-900: #00374b;
  --color-sea-of-stars-950: #0a212c;
  --color-bellini: #f9c7ad;
  --color-bellini-50: #ffefe6;
  --color-bellini-100: #ffe1d1;
  --color-bellini-200: #f9c7ad;
  --color-bellini-300: #deb39d;
  --color-bellini-400: #c1937b;
  --color-bellini-500: #a67860;
  --color-bellini-600: #8a5f48;
  --color-bellini-700: #714a35;
  --color-bellini-800: #5b3927;
  --color-bellini-900: #472b1b;
  --color-bellini-950: #2e190e;
}