Classic Bleu Ciel Horizon palette

Colors in Classic Bleu Ciel Horizon: HEX, RGB, HSL & OKLCH

• bg

  #E4FCFF

  #E4FCFF color page →

  RGB

  rgb(228 252 255)

  HSL

  hsl(187 100% 95%)

  OKLCH

  oklch(0.975 0.025 205.8)

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

• surface

  #75C0D2

  #75C0D2 color page →

  RGB

  rgb(117 192 210)

  HSL

  hsl(192 51% 64%)

  OKLCH

  oklch(0.765 0.079 214.8)

  WCAG contrast: on white 2.05:1 (Fail) · on black 10.22:1 (AAA)

• primary

  #1C79A1

  #1C79A1 color page →

  RGB

  rgb(28 121 161)

  HSL

  hsl(198 70% 37%)

  OKLCH

  oklch(0.543 0.102 232.5)

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

• accent

  #004E5E

  #004E5E color page →

  RGB

  rgb(0 78 94)

  HSL

  hsl(190 100% 18%)

  OKLCH

  oklch(0.391 0.07 217.6)

  WCAG contrast: on white 9.32:1 (AAA) · on black 2.25:1 (Fail)

• text

  #001323

  #001323 color page →

  RGB

  rgb(0 19 35)

  HSL

  hsl(207 100% 7%)

  OKLCH

  oklch(0.18 0.044 243.3)

  WCAG contrast: on white 18.79:1 (AAA) · on black 1.11:1 (Fail)

Export Classic Bleu Ciel Horizon: CSS variables, Tailwind & JSON

:root {
  --bg: #e4fcff;
  --surface: #75c0d2;
  --primary: #1c79a1;
  --accent: #004e5e;
  --text: #001323;
}

@theme {
  --color-bg: #e4fcff;
  --color-surface: #75c0d2;
  --color-primary: #1c79a1;
  --color-accent: #004e5e;
  --color-text: #001323;
}

{
  "classic-bleu-ciel-horizon-7lu": {
    "bg": {
      "$type": "color",
      "$value": "#e4fcff"
    },
    "surface": {
      "$type": "color",
      "$value": "#75c0d2"
    },
    "primary": {
      "$type": "color",
      "$value": "#1c79a1"
    },
    "accent": {
      "$type": "color",
      "$value": "#004e5e"
    },
    "text": {
      "$type": "color",
      "$value": "#001323"
    }
  }
}