Classic Bucolic Cascade palette

Colors in Classic Bucolic Cascade: HEX, RGB, HSL & OKLCH

• bg

  #EEF4EE

  #EEF4EE color page →

  RGB

  rgb(238 244 238)

  HSL

  hsl(120 21% 95%)

  OKLCH

  oklch(0.961 0.01 145.5)

  WCAG contrast: on white 1.11:1 (Fail) · on black 18.81:1 (AAA)

• surface

  #88A872

  #88A872 color page →

  RGB

  rgb(136 168 114)

  HSL

  hsl(96 24% 55%)

  OKLCH

  oklch(0.694 0.084 133.1)

  WCAG contrast: on white 2.66:1 (Fail) · on black 7.89:1 (AAA)

• primary

  #316B34

  #316B34 color page →

  RGB

  rgb(49 107 52)

  HSL

  hsl(123 37% 31%)

  OKLCH

  oklch(0.474 0.105 144.7)

  WCAG contrast: on white 6.39:1 (AA) · on black 3.28:1 (Fail)

• accent

  #003F22

  #003F22 color page →

  RGB

  rgb(0 63 34)

  HSL

  hsl(152 100% 12%)

  OKLCH

  oklch(0.323 0.078 156.1)

  WCAG contrast: on white 12.11:1 (AAA) · on black 1.73:1 (Fail)

• text

  #011104

  #011104 color page →

  RGB

  rgb(1 17 4)

  HSL

  hsl(131 89% 4%)

  OKLCH

  oklch(0.157 0.04 149.4)

  WCAG contrast: on white 19.38:1 (AAA) · on black 1.08:1 (Fail)

Export Classic Bucolic Cascade: CSS variables, Tailwind & JSON

:root {
  --bg: #eef4ee;
  --surface: #88a872;
  --primary: #316b34;
  --accent: #003f22;
  --text: #011104;
}

@theme {
  --color-bg: #eef4ee;
  --color-surface: #88a872;
  --color-primary: #316b34;
  --color-accent: #003f22;
  --color-text: #011104;
}

{
  "classic-bucolic-cascade-4kt": {
    "bg": {
      "$type": "color",
      "$value": "#eef4ee"
    },
    "surface": {
      "$type": "color",
      "$value": "#88a872"
    },
    "primary": {
      "$type": "color",
      "$value": "#316b34"
    },
    "accent": {
      "$type": "color",
      "$value": "#003f22"
    },
    "text": {
      "$type": "color",
      "$value": "#011104"
    }
  }
}