Airy Sunken Treasure Canvas palette

Colors in Airy Sunken Treasure Canvas: HEX, RGB, HSL & OKLCH

• bg

  #F6F1EB

  #F6F1EB color page →

  RGB

  rgb(246 241 235)

  HSL

  hsl(33 38% 94%)

  OKLCH

  oklch(0.96 0.01 72.7)

  WCAG contrast: on white 1.12:1 (Fail) · on black 18.70:1 (AAA)

• surface

  #F5E0C1

  #F5E0C1 color page →

  RGB

  rgb(245 224 193)

  HSL

  hsl(36 72% 86%)

  OKLCH

  oklch(0.916 0.047 77.6)

  WCAG contrast: on white 1.28:1 (Fail) · on black 16.31:1 (AAA)

• primary

  #C9CC8F

  #C9CC8F color page →

  RGB

  rgb(201 204 143)

  HSL

  hsl(63 37% 68%)

  OKLCH

  oklch(0.828 0.08 110.4)

  WCAG contrast: on white 1.67:1 (Fail) · on black 12.51:1 (AAA)

• accent

  #D2B197

  #D2B197 color page →

  RGB

  rgb(210 177 151)

  HSL

  hsl(26 40% 71%)

  OKLCH

  oklch(0.783 0.052 60.2)

  WCAG contrast: on white 2.00:1 (Fail) · on black 10.47:1 (AAA)

• text

  #372C1B

  #372C1B color page →

  RGB

  rgb(55 44 27)

  HSL

  hsl(36 34% 16%)

  OKLCH

  oklch(0.301 0.032 77.9)

  WCAG contrast: on white 13.64:1 (AAA) · on black 1.53:1 (Fail)

Export Airy Sunken Treasure Canvas: CSS variables, Tailwind & JSON

:root {
  --bg: #f6f1eb;
  --surface: #f5e0c1;
  --primary: #c9cc8f;
  --accent: #d2b197;
  --text: #372c1b;
}

@theme {
  --color-bg: #f6f1eb;
  --color-surface: #f5e0c1;
  --color-primary: #c9cc8f;
  --color-accent: #d2b197;
  --color-text: #372c1b;
}

{
  "airy-sunken-treasure-canvas-6hf": {
    "bg": {
      "$type": "color",
      "$value": "#f6f1eb"
    },
    "surface": {
      "$type": "color",
      "$value": "#f5e0c1"
    },
    "primary": {
      "$type": "color",
      "$value": "#c9cc8f"
    },
    "accent": {
      "$type": "color",
      "$value": "#d2b197"
    },
    "text": {
      "$type": "color",
      "$value": "#372c1b"
    }
  }
}