Someday

CSS

:root {
  --someday: #efe4cc;
  --someday-rgb: 239 228 204;
  --someday-oklch: oklch(0.921 0.034 86.3);
}

.element {
  color: var(--someday);
  background-color: hsl(41 52% 87%);
  border-color: oklch(0.921 0.034 86.3);
}

Tailwind CSS v4

@theme {
  --color-someday: #efe4cc;
  --color-someday-50: #f9f5ea;
  --color-someday-100: #ece7db;
  --color-someday-200: #dad4c4;
  --color-someday-300: #beb7a4;
  --color-someday-400: #a79d88;
  --color-someday-500: #90856d;
  --color-someday-600: #7a715c;
  --color-someday-700: #625a4a;
  --color-someday-800: #484235;
  --color-someday-900: #322d24;
  --color-someday-950: #1e1a13;
}

SCSS

$someday: #efe4cc;
$someday-rgb: 239, 228, 204;
$someday-light: mix(#fff, $someday, 20%);
$someday-dark: mix(#000, $someday, 20%);

.element {
  color: $someday;
  box-shadow: 0 0 0 2px rgba($someday, 0.35);
}