Steady Ecological Bloom palette

Colors in Steady Ecological Bloom: HEX, RGB, HSL & OKLCH

• bg

  #EEFBF2

  #EEFBF2 color page →

  RGB

  rgb(238 251 242)

  HSL

  hsl(138 62% 96%)

  OKLCH

  oklch(0.976 0.018 155.8)

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

• surface

  #A3BCAE

  #A3BCAE color page →

  RGB

  rgb(163 188 174)

  HSL

  hsl(146 16% 69%)

  OKLCH

  oklch(0.772 0.034 161)

  WCAG contrast: on white 2.02:1 (Fail) · on black 10.36:1 (AAA)

• primary

  #597C71

  #597C71 color page →

  RGB

  rgb(89 124 113)

  HSL

  hsl(161 16% 42%)

  OKLCH

  oklch(0.556 0.043 173.2)

  WCAG contrast: on white 4.61:1 (AA) · on black 4.54:1 (AA)

• accent

  #223B32

  #223B32 color page →

  RGB

  rgb(34 59 50)

  HSL

  hsl(158 27% 18%)

  OKLCH

  oklch(0.329 0.035 169.3)

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

• text

  #090B0B

  #090B0B color page →

  RGB

  rgb(9 11 11)

  HSL

  hsl(180 10% 4%)

  OKLCH

  oklch(0.147 0.003 196.8)

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

Export Steady Ecological Bloom: CSS variables, Tailwind & JSON

:root {
  --bg: #eefbf2;
  --surface: #a3bcae;
  --primary: #597c71;
  --accent: #223b32;
  --text: #090b0b;
}

@theme {
  --color-bg: #eefbf2;
  --color-surface: #a3bcae;
  --color-primary: #597c71;
  --color-accent: #223b32;
  --color-text: #090b0b;
}

{
  "steady-ecological-bloom-6v4": {
    "bg": {
      "$type": "color",
      "$value": "#eefbf2"
    },
    "surface": {
      "$type": "color",
      "$value": "#a3bcae"
    },
    "primary": {
      "$type": "color",
      "$value": "#597c71"
    },
    "accent": {
      "$type": "color",
      "$value": "#223b32"
    },
    "text": {
      "$type": "color",
      "$value": "#090b0b"
    }
  }
}