Vampire Fangs to Augustus Asparagus color palette

CB2857Vampire Fangs 003B56Maniac Mansion FFB4D0Candy Bar 446000Serrano Pepper 95AC00Augustus Asparagus

Open in generator Export PNG, PDF, ASE…

About this palette

Vampire Fangs to Augustus Asparagus is a 5-color cool palette: #CB2857 (Vampire Fangs), #003B56 (Maniac Mansion), #FFB4D0 (Candy Bar), #446000 (Serrano Pepper), #95AC00 (Augustus Asparagus). It mixes red, blue, pink, green tones and feels cool overall. The strongest text pairing is #003B56 on #FFB4D0 with a contrast ratio of 7.21:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Vampire Fangs	rgb(203, 40, 87)	hsl(343, 67%, 48%)
Maniac Mansion	rgb(0, 59, 86)	hsl(199, 100%, 17%)
Candy Bar	rgb(255, 180, 208)	hsl(338, 100%, 85%)
Serrano Pepper	rgb(68, 96, 0)	hsl(77, 100%, 19%)
Augustus Asparagus	rgb(149, 172, 0)	hsl(68, 100%, 34%)

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.21:1 Very good#003B56 on #FFB4D0
Aa7.21:1 Very good#FFB4D0 on #003B56
Aa4.65:1 Good#003B56 on #95AC00
Aa4.65:1 Good#95AC00 on #003B56
Aa4.35:1 Poor#FFB4D0 on #446000
Aa4.35:1 Poor#446000 on #FFB4D0
Aa3.19:1 Poor#CB2857 on #FFB4D0
Aa3.19:1 Poor#FFB4D0 on #CB2857

Color blindness preview

CSS variables

/* Vampire Fangs to Augustus Asparagus — https://swatchly.xyz/palette/cb2857-003b56-ffb4d0-446000-95ac00 */
:root {
  --vampire-fangs: #cb2857;
  --maniac-mansion: #003b56;
  --candy-bar: #ffb4d0;
  --serrano-pepper: #446000;
  --augustus-asparagus: #95ac00;
}

Tailwind CSS v4

/* Vampire Fangs to Augustus Asparagus — https://swatchly.xyz/palette/cb2857-003b56-ffb4d0-446000-95ac00 */
@theme {
  --color-vampire-fangs: #cb2857;
  --color-vampire-fangs-50: #fff1f3;
  --color-vampire-fangs-100: #ffe5e8;
  --color-vampire-fangs-200: #ffcbd1;
  --color-vampire-fangs-300: #ffa9b5;
  --color-vampire-fangs-400: #ff718d;
  --color-vampire-fangs-500: #e94a70;
  --color-vampire-fangs-600: #cb2857;
  --color-vampire-fangs-700: #a90441;
  --color-vampire-fangs-800: #870032;
  --color-vampire-fangs-900: #690025;
  --color-vampire-fangs-950: #450016;
  --color-maniac-mansion: #003b56;
  --color-maniac-mansion-50: #ebf7ff;
  --color-maniac-mansion-100: #d7efff;
  --color-maniac-mansion-200: #b7def6;
  --color-maniac-mansion-300: #9bc8e4;
  --color-maniac-mansion-400: #78a9c8;
  --color-maniac-mansion-500: #5c8ead;
  --color-maniac-mansion-600: #427492;
  --color-maniac-mansion-700: #2f5d78;
  --color-maniac-mansion-800: #204a62;
  --color-maniac-mansion-900: #003b56;
  --color-maniac-mansion-950: #0a2534;
  --color-candy-bar: #ffb4d0;
  --color-candy-bar-50: #ffe7ef;
  --color-candy-bar-100: #ffd5e4;
  --color-candy-bar-200: #ffb4d0;
  --color-candy-bar-300: #e4a3bb;
  --color-candy-bar-400: #c8839e;
  --color-candy-bar-500: #ae6984;
  --color-candy-bar-600: #92516b;
  --color-candy-bar-700: #783e56;
  --color-candy-bar-800: #622f44;
  --color-candy-bar-900: #4d2234;
  --color-candy-bar-950: #321320;
  --color-serrano-pepper: #446000;
  --color-serrano-pepper-50: #eafed0;
  --color-serrano-pepper-100: #def5c1;
  --color-serrano-pepper-200: #c8e3a5;
  --color-serrano-pepper-300: #b0cd87;
  --color-serrano-pepper-400: #8fae60;
  --color-serrano-pepper-500: #749341;
  --color-serrano-pepper-600: #5a7725;
  --color-serrano-pepper-700: #446000;
  --color-serrano-pepper-800: #344b01;
  --color-serrano-pepper-900: #273a00;
  --color-serrano-pepper-950: #172400;
  --color-augustus-asparagus: #95ac00;
  --color-augustus-asparagus-50: #edfeb8;
  --color-augustus-asparagus-100: #e2f4a5;
  --color-augustus-asparagus-200: #cde181;
  --color-augustus-asparagus-300: #b5cb59;
  --color-augustus-asparagus-400: #95ac00;
  --color-augustus-asparagus-500: #7c8f00;
  --color-augustus-asparagus-600: #637300;
  --color-augustus-asparagus-700: #4e5c00;
  --color-augustus-asparagus-800: #3d4800;
  --color-augustus-asparagus-900: #2f3700;
  --color-augustus-asparagus-950: #1d2300;
}