Classic Succulents Cascade palette

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

• bg

  #EDF5EF

  #EDF5EF color page →

  RGB

  rgb(237 245 239)

  HSL

  hsl(135 29% 95%)

  OKLCH

  oklch(0.962 0.012 153.7)

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

• surface

  #7DA784

  #7DA784 color page →

  RGB

  rgb(125 167 132)

  HSL

  hsl(130 19% 57%)

  OKLCH

  oklch(0.688 0.068 149.4)

  WCAG contrast: on white 2.71:1 (Fail) · on black 7.73:1 (AAA)

• primary

  #007545

  #007545 color page →

  RGB

  rgb(0 117 69)

  HSL

  hsl(155 100% 23%)

  OKLCH

  oklch(0.495 0.118 156.7)

  WCAG contrast: on white 5.78:1 (AA) · on black 3.63:1 (Fail)

• accent

  #004733

  #004733 color page →

  RGB

  rgb(0 71 51)

  HSL

  hsl(163 100% 14%)

  OKLCH

  oklch(0.353 0.073 166.8)

  WCAG contrast: on white 10.77:1 (AAA) · on black 1.94:1 (Fail)

• text

  #010E05

  #010E05 color page →

  RGB

  rgb(1 14 5)

  HSL

  hsl(138 87% 3%)

  OKLCH

  oklch(0.145 0.032 155)

  WCAG contrast: on white 19.69:1 (AAA) · on black 1.06:1 (Fail)

Export Classic Succulents Cascade: CSS variables, Tailwind & JSON

:root {
  --bg: #edf5ef;
  --surface: #7da784;
  --primary: #007545;
  --accent: #004733;
  --text: #010e05;
}

@theme {
  --color-bg: #edf5ef;
  --color-surface: #7da784;
  --color-primary: #007545;
  --color-accent: #004733;
  --color-text: #010e05;
}

{
  "classic-succulents-cascade-35i": {
    "bg": {
      "$type": "color",
      "$value": "#edf5ef"
    },
    "surface": {
      "$type": "color",
      "$value": "#7da784"
    },
    "primary": {
      "$type": "color",
      "$value": "#007545"
    },
    "accent": {
      "$type": "color",
      "$value": "#004733"
    },
    "text": {
      "$type": "color",
      "$value": "#010e05"
    }
  }
}