Third Eye Chakra

CSS

:root {
  --third-eye-chakra: #243bcd;
  --third-eye-chakra-rgb: 36 59 205;
  --third-eye-chakra-oklch: oklch(0.448 0.223 267.8);
}

.element {
  color: var(--third-eye-chakra);
  background-color: hsl(232 70% 47%);
  border-color: oklch(0.448 0.223 267.8);
}

Tailwind CSS v4

@theme {
  --color-third-eye-chakra: #243bcd;
  --color-third-eye-chakra-50: #dcf3ff;
  --color-third-eye-chakra-100: #cae5ff;
  --color-third-eye-chakra-200: #afcfff;
  --color-third-eye-chakra-300: #8baeff;
  --color-third-eye-chakra-400: #6692ff;
  --color-third-eye-chakra-500: #4871ff;
  --color-third-eye-chakra-600: #3d61eb;
  --color-third-eye-chakra-700: #314dbd;
  --color-third-eye-chakra-800: #1d398e;
  --color-third-eye-chakra-900: #132765;
  --color-third-eye-chakra-950: #061446;
}

SCSS

$third-eye-chakra: #243bcd;
$third-eye-chakra-rgb: 36, 59, 205;
$third-eye-chakra-light: mix(#fff, $third-eye-chakra, 20%);
$third-eye-chakra-dark: mix(#000, $third-eye-chakra, 20%);

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