Classic Broccoli Paradise System palette

Colors in Classic Broccoli Paradise System: HEX, RGB, HSL & OKLCH

• bg

  #E6FFE9

  #E6FFE9 color page →

  RGB

  rgb(230 255 233)

  HSL

  hsl(127 100% 95%)

  OKLCH

  oklch(0.976 0.039 148.8)

  WCAG contrast: on white 1.05:1 (Fail) · on black 19.84:1 (AAA)

• surface

  #7AC47A

  #7AC47A color page →

  RGB

  rgb(122 196 122)

  HSL

  hsl(120 39% 62%)

  OKLCH

  oklch(0.753 0.128 144.2)

  WCAG contrast: on white 2.09:1 (Fail) · on black 10.00:1 (AAA)

• primary

  #0E8831

  #0E8831 color page →

  RGB

  rgb(14 136 49)

  HSL

  hsl(137 81% 29%)

  OKLCH

  oklch(0.547 0.159 146.7)

  WCAG contrast: on white 4.58:1 (AA) · on black 4.58:1 (AA)

• accent

  #00440A

  #00440A color page →

  RGB

  rgb(0 68 10)

  HSL

  hsl(129 100% 13%)

  OKLCH

  oklch(0.336 0.107 144.5)

  WCAG contrast: on white 11.46:1 (AAA) · on black 1.83:1 (Fail)

• text

  #010A02

  #010A02 color page →

  RGB

  rgb(1 10 2)

  HSL

  hsl(127 82% 2%)

  OKLCH

  oklch(0.128 0.032 147.2)

  WCAG contrast: on white 20.08:1 (AAA) · on black 1.04:1 (Fail)

Export Classic Broccoli Paradise System: CSS variables, Tailwind & JSON

:root {
  --bg: #e6ffe9;
  --surface: #7ac47a;
  --primary: #0e8831;
  --accent: #00440a;
  --text: #010a02;
}

@theme {
  --color-bg: #e6ffe9;
  --color-surface: #7ac47a;
  --color-primary: #0e8831;
  --color-accent: #00440a;
  --color-text: #010a02;
}

{
  "classic-broccoli-paradise-system-7mi": {
    "bg": {
      "$type": "color",
      "$value": "#e6ffe9"
    },
    "surface": {
      "$type": "color",
      "$value": "#7ac47a"
    },
    "primary": {
      "$type": "color",
      "$value": "#0e8831"
    },
    "accent": {
      "$type": "color",
      "$value": "#00440a"
    },
    "text": {
      "$type": "color",
      "$value": "#010a02"
    }
  }
}