Bloodhound to Lime Twist Color Palette

About this palette

Bloodhound to Lime Twist is a 4-color vibrant palette: #B64E00 (Bloodhound), #009F59 (Shamrock), #A2BB00 (Leafy Woodland), #CAD200 (Lime Twist). It mixes brown, green tones and feels balanced overall. The strongest text pairing is #B64E00 on #CAD200 with a contrast ratio of 3.12:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bloodhound	rgb(182, 78, 0)	hsl(26, 100%, 36%)
Shamrock	rgb(0, 159, 89)	hsl(154, 100%, 31%)
Leafy Woodland	rgb(162, 187, 0)	hsl(68, 100%, 37%)
Lime Twist	rgb(202, 210, 0)	hsl(62, 100%, 41%)

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.

Aa3.12:1 Poor#B64E00 on #CAD200
Aa3.12:1 Poor#CAD200 on #B64E00

Color blindness preview

CSS variables

/* Bloodhound to Lime Twist — https://swatchly.xyz/palette/b64e00-009f59-a2bb00-cad200 */
:root {
  --bloodhound: #b64e00;
  --shamrock: #009f59;
  --leafy-woodland: #a2bb00;
  --lime-twist: #cad200;
}

Tailwind CSS v4

/* Bloodhound to Lime Twist — https://swatchly.xyz/palette/b64e00-009f59-a2bb00-cad200 */
@theme {
  --color-bloodhound: #b64e00;
  --color-bloodhound-50: #fff2ec;
  --color-bloodhound-100: #ffe7db;
  --color-bloodhound-200: #ffcdb6;
  --color-bloodhound-300: #ffae86;
  --color-bloodhound-400: #ee8650;
  --color-bloodhound-500: #d3692d;
  --color-bloodhound-600: #b64e00;
  --color-bloodhound-700: #923d00;
  --color-bloodhound-800: #732e00;
  --color-bloodhound-900: #5a2200;
  --color-bloodhound-950: #3a1400;
  --color-shamrock: #009f59;
  --color-shamrock-50: #ddffe7;
  --color-shamrock-100: #b8fecf;
  --color-shamrock-200: #98eeb5;
  --color-shamrock-300: #74d99a;
  --color-shamrock-400: #42bb76;
  --color-shamrock-500: #009f59;
  --color-shamrock-600: #008047;
  --color-shamrock-700: #006637;
  --color-shamrock-800: #00502a;
  --color-shamrock-900: #003e1f;
  --color-shamrock-950: #002711;
  --color-leafy-woodland: #a2bb00;
  --color-leafy-woodland-50: #f5ffd7;
  --color-leafy-woodland-100: #eafcae;
  --color-leafy-woodland-200: #d7eb8c;
  --color-leafy-woodland-300: #c1d866;
  --color-leafy-woodland-400: #a2bb00;
  --color-leafy-woodland-500: #869b00;
  --color-leafy-woodland-600: #6b7d00;
  --color-leafy-woodland-700: #546200;
  --color-leafy-woodland-800: #414c00;
  --color-leafy-woodland-900: #303900;
  --color-leafy-woodland-950: #1d2300;
  --color-lime-twist: #cad200;
  --color-lime-twist-50: #f9ffbe;
  --color-lime-twist-100: #f0f8a1;
  --color-lime-twist-200: #dee67b;
  --color-lime-twist-300: #cad200;
  --color-lime-twist-400: #a9b000;
  --color-lime-twist-500: #8c9200;
  --color-lime-twist-600: #707500;
  --color-lime-twist-700: #585c00;
  --color-lime-twist-800: #444700;
  --color-lime-twist-900: #343600;
  --color-lime-twist-950: #202200;
}