Skip to content

Instantly share code, notes, and snippets.

@StoneyEagle
Created April 10, 2022 19:12
Show Gist options
  • Save StoneyEagle/45d7b02b49a6d3897d42635d17818bf0 to your computer and use it in GitHub Desktop.
Save StoneyEagle/45d7b02b49a6d3897d42635d17818bf0 to your computer and use it in GitHub Desktop.
:root {
--col-deg: 265deg;
--col-sat: 50%;
--col-bright: 90%;
--bg-deg: 265deg;
--bg-sat: 1%;
--bg-bright: 60%;
--theme-color: hsl(var(--col-deg), calc(var(--col-sat) / 100 * 100), calc((var(--col-bright) / 100) * 50));
--gradient-color: hsl(var(--bg-deg), calc(var(--bg-sat) / 100 * 70), calc((var(--bg-bright) / 100) * 30));
--color-900: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 9));
--color-800: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 16));
--color-700: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 24));
--color-600: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 32));
--color-500: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 40));
--color-400: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 48));
--color-300: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 56));
--color-200: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 64));
--color-100: hsl(var(--bg-deg), var(--bg-sat), calc((var(--bg-bright) / 100) * 72));
--color-950: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 9));
--color-850: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 16));
--color-750: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 24));
--color-650: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 32));
--color-550: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 40));
--color-450: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 48));
--color-350: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 56));
--color-250: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 64));
--color-150: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 72));
--color-50: hsl(var(--col-deg), var(--col-sat), calc((var(--col-bright) / 100) * 88));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment