True Forget-Me-Not Studio palette

Colors in True Forget-Me-Not Studio: HEX, RGB, HSL & OKLCH

• bg

  #D4DADE

  #D4DADE color page →

  RGB

  rgb(212 218 222)

  HSL

  hsl(204 13% 85%)

  OKLCH

  oklch(0.885 0.009 236.6)

  WCAG contrast: on white 1.41:1 (Fail) · on black 14.88:1 (AAA)

• surface

  #85B3D8

  #85B3D8 color page →

  RGB

  rgb(133 179 216)

  HSL

  hsl(207 52% 68%)

  OKLCH

  oklch(0.747 0.073 243.2)

  WCAG contrast: on white 2.22:1 (Fail) · on black 9.43:1 (AAA)

• primary

  #1E8CC2

  #1E8CC2 color page →

  RGB

  rgb(30 140 194)

  HSL

  hsl(200 73% 44%)

  OKLCH

  oklch(0.607 0.123 236.6)

  WCAG contrast: on white 3.75:1 (Fail) · on black 5.58:1 (AA)

• accent

  #0E4D72

  #0E4D72 color page →

  RGB

  rgb(14 77 114)

  HSL

  hsl(202 78% 25%)

  OKLCH

  oklch(0.402 0.086 240.9)

  WCAG contrast: on white 9.03:1 (AAA) · on black 2.32:1 (Fail)

• text

  #051B29

  #051B29 color page →

  RGB

  rgb(5 27 41)

  HSL

  hsl(203 78% 9%)

  OKLCH

  oklch(0.212 0.04 239.4)

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

Export True Forget-Me-Not Studio: CSS variables, Tailwind & JSON

:root {
  --bg: #d4dade;
  --surface: #85b3d8;
  --primary: #1e8cc2;
  --accent: #0e4d72;
  --text: #051b29;
}

@theme {
  --color-bg: #d4dade;
  --color-surface: #85b3d8;
  --color-primary: #1e8cc2;
  --color-accent: #0e4d72;
  --color-text: #051b29;
}

{
  "true-forget-me-not-studio-76x": {
    "bg": {
      "$type": "color",
      "$value": "#d4dade"
    },
    "surface": {
      "$type": "color",
      "$value": "#85b3d8"
    },
    "primary": {
      "$type": "color",
      "$value": "#1e8cc2"
    },
    "accent": {
      "$type": "color",
      "$value": "#0e4d72"
    },
    "text": {
      "$type": "color",
      "$value": "#051b29"
    }
  }
}