True Queen Blue Studio palette

Colors in True Queen Blue Studio: HEX, RGB, HSL & OKLCH

• bg

  #DAE9FE

  #DAE9FE color page →

  RGB

  rgb(218 233 254)

  HSL

  hsl(215 95% 93%)

  OKLCH

  oklch(0.929 0.033 256.8)

  WCAG contrast: on white 1.23:1 (Fail) · on black 17.06:1 (AAA)

• surface

  #85A9D3

  #85A9D3 color page →

  RGB

  rgb(133 169 211)

  HSL

  hsl(212 47% 67%)

  OKLCH

  oklch(0.724 0.073 252.7)

  WCAG contrast: on white 2.43:1 (Fail) · on black 8.61:1 (AAA)

• primary

  #3969A1

  #3969A1 color page →

  RGB

  rgb(57 105 161)

  HSL

  hsl(212 48% 43%)

  OKLCH

  oklch(0.514 0.104 253.6)

  WCAG contrast: on white 5.66:1 (AA) · on black 3.70:1 (Fail)

• accent

  #1F3F62

  #1F3F62 color page →

  RGB

  rgb(31 63 98)

  HSL

  hsl(211 52% 25%)

  OKLCH

  oklch(0.361 0.072 252.3)

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

• text

  #071E33

  #071E33 color page →

  RGB

  rgb(7 30 51)

  HSL

  hsl(209 76% 11%)

  OKLCH

  oklch(0.229 0.05 249)

  WCAG contrast: on white 16.90:1 (AAA) · on black 1.24:1 (Fail)

Export True Queen Blue Studio: CSS variables, Tailwind & JSON

:root {
  --bg: #dae9fe;
  --surface: #85a9d3;
  --primary: #3969a1;
  --accent: #1f3f62;
  --text: #071e33;
}

@theme {
  --color-bg: #dae9fe;
  --color-surface: #85a9d3;
  --color-primary: #3969a1;
  --color-accent: #1f3f62;
  --color-text: #071e33;
}

{
  "true-queen-blue-studio-3q6": {
    "bg": {
      "$type": "color",
      "$value": "#dae9fe"
    },
    "surface": {
      "$type": "color",
      "$value": "#85a9d3"
    },
    "primary": {
      "$type": "color",
      "$value": "#3969a1"
    },
    "accent": {
      "$type": "color",
      "$value": "#1f3f62"
    },
    "text": {
      "$type": "color",
      "$value": "#071e33"
    }
  }
}