Classic Mellow Mango Archive palette

Colors in Classic Mellow Mango Archive: HEX, RGB, HSL & OKLCH

• bg

  #FBE8D9

  #FBE8D9 color page →

  RGB

  rgb(251 232 217)

  HSL

  hsl(26 81% 92%)

  OKLCH

  oklch(0.942 0.029 60.8)

  WCAG contrast: on white 1.19:1 (Fail) · on black 17.64:1 (AAA)

• surface

  #CB4100

  #CB4100 color page →

  RGB

  rgb(203 65 0)

  HSL

  hsl(19 100% 40%)

  OKLCH

  oklch(0.568 0.184 38.5)

  WCAG contrast: on white 4.88:1 (AA) · on black 4.29:1 (Fail)

• primary

  #006CBE

  #006CBE color page →

  RGB

  rgb(0 108 190)

  HSL

  hsl(206 100% 37%)

  OKLCH

  oklch(0.525 0.152 250.9)

  WCAG contrast: on white 5.40:1 (AA) · on black 3.88:1 (Fail)

• accent

  #982180

  #982180 color page →

  RGB

  rgb(152 33 128)

  HSL

  hsl(312 64% 36%)

  OKLCH

  oklch(0.478 0.183 337.8)

  WCAG contrast: on white 7.33:1 (AAA) · on black 2.86:1 (Fail)

• text

  #0E0804

  #0E0804 color page →

  RGB

  rgb(14 8 4)

  HSL

  hsl(24 56% 4%)

  OKLCH

  oklch(0.141 0.016 62.9)

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

Export Classic Mellow Mango Archive: CSS variables, Tailwind & JSON

:root {
  --bg: #fbe8d9;
  --surface: #cb4100;
  --primary: #006cbe;
  --accent: #982180;
  --text: #0e0804;
}

@theme {
  --color-bg: #fbe8d9;
  --color-surface: #cb4100;
  --color-primary: #006cbe;
  --color-accent: #982180;
  --color-text: #0e0804;
}

{
  "classic-mellow-mango-archive-328": {
    "bg": {
      "$type": "color",
      "$value": "#fbe8d9"
    },
    "surface": {
      "$type": "color",
      "$value": "#cb4100"
    },
    "primary": {
      "$type": "color",
      "$value": "#006cbe"
    },
    "accent": {
      "$type": "color",
      "$value": "#982180"
    },
    "text": {
      "$type": "color",
      "$value": "#0e0804"
    }
  }
}