Steady Loch Ness Cascade palette

Colors in Steady Loch Ness Cascade: HEX, RGB, HSL & OKLCH

• bg

  #DDE1F7

  #DDE1F7 color page →

  RGB

  rgb(221 225 247)

  HSL

  hsl(231 62% 92%)

  OKLCH

  oklch(0.913 0.03 277.6)

  WCAG contrast: on white 1.29:1 (Fail) · on black 16.18:1 (AAA)

• surface

  #9CB2E4

  #9CB2E4 color page →

  RGB

  rgb(156 178 228)

  HSL

  hsl(222 57% 75%)

  OKLCH

  oklch(0.765 0.076 266.1)

  WCAG contrast: on white 2.12:1 (Fail) · on black 9.90:1 (AAA)

• primary

  #676AC2

  #676AC2 color page →

  RGB

  rgb(103 106 194)

  HSL

  hsl(238 43% 58%)

  OKLCH

  oklch(0.564 0.134 279.7)

  WCAG contrast: on white 4.75:1 (AA) · on black 4.41:1 (Fail)

• accent

  #4D3E7D

  #4D3E7D color page →

  RGB

  rgb(77 62 125)

  HSL

  hsl(254 34% 37%)

  OKLCH

  oklch(0.411 0.103 292.2)

  WCAG contrast: on white 9.12:1 (AAA) · on black 2.30:1 (Fail)

• text

  #111328

  #111328 color page →

  RGB

  rgb(17 19 40)

  HSL

  hsl(235 40% 11%)

  OKLCH

  oklch(0.197 0.042 277.7)

  WCAG contrast: on white 18.29:1 (AAA) · on black 1.14:1 (Fail)

Export Steady Loch Ness Cascade: CSS variables, Tailwind & JSON

:root {
  --bg: #dde1f7;
  --surface: #9cb2e4;
  --primary: #676ac2;
  --accent: #4d3e7d;
  --text: #111328;
}

@theme {
  --color-bg: #dde1f7;
  --color-surface: #9cb2e4;
  --color-primary: #676ac2;
  --color-accent: #4d3e7d;
  --color-text: #111328;
}

{
  "steady-loch-ness-cascade-2q2": {
    "bg": {
      "$type": "color",
      "$value": "#dde1f7"
    },
    "surface": {
      "$type": "color",
      "$value": "#9cb2e4"
    },
    "primary": {
      "$type": "color",
      "$value": "#676ac2"
    },
    "accent": {
      "$type": "color",
      "$value": "#4d3e7d"
    },
    "text": {
      "$type": "color",
      "$value": "#111328"
    }
  }
}