Classic French Blue Forge palette

Colors in Classic French Blue Forge: HEX, RGB, HSL & OKLCH

• bg

  #000714

  #000714 color page →

  RGB

  rgb(0 7 20)

  HSL

  hsl(219 100% 4%)

  OKLCH

  oklch(0.127 0.036 249.9)

  WCAG contrast: on white 20.18:1 (AAA) · on black 1.04:1 (Fail)

• surface

  #11386A

  #11386A color page →

  RGB

  rgb(17 56 106)

  HSL

  hsl(214 72% 24%)

  OKLCH

  oklch(0.343 0.097 256.4)

  WCAG contrast: on white 11.68:1 (AAA) · on black 1.79:1 (Fail)

• primary

  #1F6FB1

  #1F6FB1 color page →

  RGB

  rgb(31 111 177)

  HSL

  hsl(207 70% 41%)

  OKLCH

  oklch(0.528 0.128 248.5)

  WCAG contrast: on white 5.29:1 (AA) · on black 3.96:1 (Fail)

• accent

  #84BBF4

  #84BBF4 color page →

  RGB

  rgb(132 187 244)

  HSL

  hsl(211 84% 74%)

  OKLCH

  oklch(0.776 0.1 250.1)

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

• text

  #DBF1FF

  #DBF1FF color page →

  RGB

  rgb(219 241 255)

  HSL

  hsl(203 100% 93%)

  OKLCH

  oklch(0.946 0.03 235.6)

  WCAG contrast: on white 1.16:1 (Fail) · on black 18.03:1 (AAA)

Export Classic French Blue Forge: CSS variables, Tailwind & JSON

:root {
  --bg: #000714;
  --surface: #11386a;
  --primary: #1f6fb1;
  --accent: #84bbf4;
  --text: #dbf1ff;
}

@theme {
  --color-bg: #000714;
  --color-surface: #11386a;
  --color-primary: #1f6fb1;
  --color-accent: #84bbf4;
  --color-text: #dbf1ff;
}

{
  "classic-french-blue-forge-1ko": {
    "bg": {
      "$type": "color",
      "$value": "#000714"
    },
    "surface": {
      "$type": "color",
      "$value": "#11386a"
    },
    "primary": {
      "$type": "color",
      "$value": "#1f6fb1"
    },
    "accent": {
      "$type": "color",
      "$value": "#84bbf4"
    },
    "text": {
      "$type": "color",
      "$value": "#dbf1ff"
    }
  }
}