Frosted Blueberries Ledger palette

Colors in Frosted Blueberries Ledger: HEX, RGB, HSL & OKLCH

• bg

  #E1ECF4

  #E1ECF4 color page →

  RGB

  rgb(225 236 244)

  HSL

  hsl(205 46% 92%)

  OKLCH

  oklch(0.937 0.016 239.1)

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

• surface

  #2ED8FF

  #2ED8FF color page →

  RGB

  rgb(46 216 255)

  HSL

  hsl(191 100% 59%)

  OKLCH

  oklch(0.817 0.139 218.3)

  WCAG contrast: on white 1.69:1 (Fail) · on black 12.38:1 (AAA)

• muted

  #009FED

  #009FED color page →

  RGB

  rgb(0 159 237)

  HSL

  hsl(200 100% 46%)

  OKLCH

  oklch(0.672 0.158 241.4)

  WCAG contrast: on white 2.92:1 (Fail) · on black 7.18:1 (AAA)

• primary

  #005DCF

  #005DCF color page →

  RGB

  rgb(0 93 207)

  HSL

  hsl(213 100% 41%)

  OKLCH

  oklch(0.505 0.192 258.6)

  WCAG contrast: on white 6.05:1 (AA) · on black 3.46:1 (Fail)

• accent

  #003595

  #003595 color page →

  RGB

  rgb(0 53 149)

  HSL

  hsl(219 100% 29%)

  OKLCH

  oklch(0.371 0.165 261.5)

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

• text

  #001639

  #001639 color page →

  RGB

  rgb(0 22 57)

  HSL

  hsl(217 100% 11%)

  OKLCH

  oklch(0.208 0.075 257.3)

  WCAG contrast: on white 17.88:1 (AAA) · on black 1.17:1 (Fail)

Export Frosted Blueberries Ledger: CSS variables, Tailwind & JSON

:root {
  --bg: #e1ecf4;
  --surface: #2ed8ff;
  --muted: #009fed;
  --primary: #005dcf;
  --accent: #003595;
  --text: #001639;
}

@theme {
  --color-bg: #e1ecf4;
  --color-surface: #2ed8ff;
  --color-muted: #009fed;
  --color-primary: #005dcf;
  --color-accent: #003595;
  --color-text: #001639;
}

{
  "frosted-blueberries-ledger-wh": {
    "bg": {
      "$type": "color",
      "$value": "#e1ecf4"
    },
    "surface": {
      "$type": "color",
      "$value": "#2ed8ff"
    },
    "muted": {
      "$type": "color",
      "$value": "#009fed"
    },
    "primary": {
      "$type": "color",
      "$value": "#005dcf"
    },
    "accent": {
      "$type": "color",
      "$value": "#003595"
    },
    "text": {
      "$type": "color",
      "$value": "#001639"
    }
  }
}