Topiary Green to Gold Tooth color palette

6A7500Topiary Green 7E66FFCandy Grape Fizz D37000Cinnamon 4F94FFPolar Glow 3FD853Koopa Green Shell DFB700Gold Tooth

Open in generator Export PNG, PDF, ASE…

About this palette

Topiary Green to Gold Tooth is a 6-color vibrant, cool palette: #6A7500 (Topiary Green), #7E66FF (Candy Grape Fizz), #D37000 (Cinnamon), #4F94FF (Polar Glow), #3FD853 (Koopa Green Shell), #DFB700 (Gold Tooth). It mixes green, purple, orange, blue, yellow tones and feels cool overall. The strongest text pairing is #6A7500 on #3FD853 with a contrast ratio of 2.68:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Topiary Green	rgb(106, 117, 0)	hsl(66, 100%, 23%)
Candy Grape Fizz	rgb(126, 102, 255)	hsl(249, 100%, 70%)
Cinnamon	rgb(211, 112, 0)	hsl(32, 100%, 41%)
Polar Glow	rgb(79, 148, 255)	hsl(216, 100%, 65%)
Koopa Green Shell	rgb(63, 216, 83)	hsl(128, 66%, 55%)
Gold Tooth	rgb(223, 183, 0)	hsl(49, 100%, 44%)

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.

Color blindness preview

CSS variables

/* Topiary Green to Gold Tooth — https://swatchly.xyz/palette/6a7500-7e66ff-d37000-4f94ff-3fd853-dfb700 */
:root {
  --topiary-green: #6a7500;
  --candy-grape-fizz: #7e66ff;
  --cinnamon: #d37000;
  --polar-glow: #4f94ff;
  --koopa-green-shell: #3fd853;
  --gold-tooth: #dfb700;
}

Tailwind CSS v4

/* Topiary Green to Gold Tooth — https://swatchly.xyz/palette/6a7500-7e66ff-d37000-4f94ff-3fd853-dfb700 */
@theme {
  --color-topiary-green: #6a7500;
  --color-topiary-green-50: #f2fcc8;
  --color-topiary-green-100: #e8f2b9;
  --color-topiary-green-200: #d4e09b;
  --color-topiary-green-300: #beca7b;
  --color-topiary-green-400: #9fab50;
  --color-topiary-green-500: #84902d;
  --color-topiary-green-600: #6a7500;
  --color-topiary-green-700: #545d00;
  --color-topiary-green-800: #414800;
  --color-topiary-green-900: #323800;
  --color-topiary-green-950: #1e2300;
  --color-candy-grape-fizz: #7e66ff;
  --color-candy-grape-fizz-50: #f3f4ff;
  --color-candy-grape-fizz-100: #e8e8ff;
  --color-candy-grape-fizz-200: #d2d2ff;
  --color-candy-grape-fizz-300: #b9b7ff;
  --color-candy-grape-fizz-400: #988fff;
  --color-candy-grape-fizz-500: #7e66ff;
  --color-candy-grape-fizz-600: #6649de;
  --color-candy-grape-fizz-700: #5133bc;
  --color-candy-grape-fizz-800: #40219b;
  --color-candy-grape-fizz-900: #31157e;
  --color-candy-grape-fizz-950: #1f0855;
  --color-cinnamon: #d37000;
  --color-cinnamon-50: #fff4ed;
  --color-cinnamon-100: #ffe9db;
  --color-cinnamon-200: #ffd1b1;
  --color-cinnamon-300: #ffb37b;
  --color-cinnamon-400: #ed8d3e;
  --color-cinnamon-500: #d37000;
  --color-cinnamon-600: #ab5900;
  --color-cinnamon-700: #884600;
  --color-cinnamon-800: #6b3600;
  --color-cinnamon-900: #532800;
  --color-cinnamon-950: #351700;
  --color-polar-glow: #4f94ff;
  --color-polar-glow-50: #e9f2ff;
  --color-polar-glow-100: #d6e6ff;
  --color-polar-glow-200: #b4d1ff;
  --color-polar-glow-300: #8bb9ff;
  --color-polar-glow-400: #4f94ff;
  --color-polar-glow-500: #3579e2;
  --color-polar-glow-600: #1d60c3;
  --color-polar-glow-700: #0a4ba4;
  --color-polar-glow-800: #003988;
  --color-polar-glow-900: #002d6d;
  --color-polar-glow-950: #001c4a;
  --color-koopa-green-shell: #3fd853;
  --color-koopa-green-shell-50: #ceffce;
  --color-koopa-green-shell-100: #a4fda7;
  --color-koopa-green-shell-200: #7feb85;
  --color-koopa-green-shell-300: #3fd853;
  --color-koopa-green-shell-400: #0db835;
  --color-koopa-green-shell-500: #009a29;
  --color-koopa-green-shell-600: #007d1f;
  --color-koopa-green-shell-700: #006417;
  --color-koopa-green-shell-800: #005010;
  --color-koopa-green-shell-900: #003f0b;
  --color-koopa-green-shell-950: #002804;
  --color-gold-tooth: #dfb700;
  --color-gold-tooth-50: #fff2c8;
  --color-gold-tooth-100: #ffe695;
  --color-gold-tooth-200: #efd16c;
  --color-gold-tooth-300: #dfb700;
  --color-gold-tooth-400: #bb9900;
  --color-gold-tooth-500: #9c8000;
  --color-gold-tooth-600: #7e6700;
  --color-gold-tooth-700: #655200;
  --color-gold-tooth-800: #504000;
  --color-gold-tooth-900: #3e3100;
  --color-gold-tooth-950: #271e00;
}