@fylgja/tokens
Version:
[](https://www.npmjs.com/package/@fylgja/tokens) [](https://www.npmjs.com/package/@fylgja/tokens) [ • 12.2 kB
CSS
@theme {
--aspect-box: 1;
--aspect-landscape: 4/3;
--aspect-portrait: 3/4;
--aspect-widescreen: 16/9;
--aspect-superwide: 21/9;
--aspect-ultrawide: 18/5;
--aspect-golden: 1.618/1;
--color-pink-0: oklch(99% .03 350);
--color-pink-50: oklch(95% .06 350);
--color-pink-100: oklch(90% .12 350);
--color-pink-150: oklch(88% .14 350);
--color-pink-200: oklch(82% .16 350);
--color-pink-300: oklch(78% .17 350);
--color-pink-400: oklch(68% .19 350);
--color-pink-500: oklch(58% .21 350);
--color-pink-600: oklch(52% .20 350);
--color-pink-700: oklch(44% .18 350);
--color-pink-800: oklch(35% .15 350);
--color-pink-850: oklch(28% .12 350);
--color-pink-900: oklch(20% .10 350);
--color-pink-950: oklch(15% .07 350);
--color-pink-1000: oklch(11% .05 350);
--color-purple-0: oklch(99% .03 330);
--color-purple-50: oklch(95% .06 330);
--color-purple-100: oklch(90% .12 330);
--color-purple-150: oklch(88% .14 330);
--color-purple-200: oklch(82% .16 330);
--color-purple-300: oklch(78% .17 330);
--color-purple-400: oklch(68% .19 330);
--color-purple-500: oklch(58% .21 330);
--color-purple-600: oklch(52% .20 330);
--color-purple-700: oklch(44% .18 330);
--color-purple-800: oklch(35% .15 330);
--color-purple-850: oklch(28% .12 330);
--color-purple-900: oklch(20% .10 330);
--color-purple-950: oklch(15% .07 330);
--color-purple-1000: oklch(11% .05 330);
--color-violet-0: oklch(99% .03 310);
--color-violet-50: oklch(95% .06 310);
--color-violet-100: oklch(90% .12 310);
--color-violet-150: oklch(88% .14 310);
--color-violet-200: oklch(82% .16 310);
--color-violet-300: oklch(78% .17 310);
--color-violet-400: oklch(68% .19 310);
--color-violet-500: oklch(58% .21 310);
--color-violet-600: oklch(52% .20 310);
--color-violet-700: oklch(44% .18 310);
--color-violet-800: oklch(35% .15 310);
--color-violet-850: oklch(28% .12 310);
--color-violet-900: oklch(20% .10 310);
--color-violet-950: oklch(15% .07 310);
--color-violet-1000: oklch(11% .05 310);
--color-indigo-0: oklch(99% .03 290);
--color-indigo-50: oklch(95% .06 290);
--color-indigo-100: oklch(90% .12 290);
--color-indigo-150: oklch(88% .14 290);
--color-indigo-200: oklch(82% .16 290);
--color-indigo-300: oklch(78% .17 290);
--color-indigo-400: oklch(68% .19 290);
--color-indigo-500: oklch(58% .21 290);
--color-indigo-600: oklch(52% .20 290);
--color-indigo-700: oklch(44% .18 290);
--color-indigo-800: oklch(35% .15 290);
--color-indigo-850: oklch(28% .12 290);
--color-indigo-900: oklch(20% .10 290);
--color-indigo-950: oklch(15% .07 290);
--color-indigo-1000: oklch(11% .05 290);
--color-blue-0: oklch(99% .03 260);
--color-blue-50: oklch(95% .06 260);
--color-blue-100: oklch(90% .12 260);
--color-blue-150: oklch(88% .14 260);
--color-blue-200: oklch(82% .16 260);
--color-blue-300: oklch(78% .17 260);
--color-blue-400: oklch(68% .19 260);
--color-blue-500: oklch(58% .21 260);
--color-blue-600: oklch(52% .20 260);
--color-blue-700: oklch(44% .18 260);
--color-blue-800: oklch(35% .15 260);
--color-blue-850: oklch(28% .12 260);
--color-blue-900: oklch(20% .10 260);
--color-blue-950: oklch(15% .07 260);
--color-blue-1000: oklch(11% .05 260);
--color-cyan-0: oklch(99% .03 220);
--color-cyan-50: oklch(95% .06 220);
--color-cyan-100: oklch(90% .12 220);
--color-cyan-150: oklch(88% .14 220);
--color-cyan-200: oklch(82% .16 220);
--color-cyan-300: oklch(78% .17 220);
--color-cyan-400: oklch(68% .19 220);
--color-cyan-500: oklch(58% .21 220);
--color-cyan-600: oklch(52% .20 220);
--color-cyan-700: oklch(44% .18 220);
--color-cyan-800: oklch(35% .15 220);
--color-cyan-850: oklch(28% .12 220);
--color-cyan-900: oklch(20% .10 220);
--color-cyan-950: oklch(15% .07 220);
--color-cyan-1000: oklch(11% .05 220);
--color-teal-0: oklch(99% .03 170);
--color-teal-50: oklch(95% .06 170);
--color-teal-100: oklch(90% .12 170);
--color-teal-150: oklch(88% .14 170);
--color-teal-200: oklch(82% .16 170);
--color-teal-300: oklch(78% .17 170);
--color-teal-400: oklch(68% .19 170);
--color-teal-500: oklch(58% .21 170);
--color-teal-600: oklch(52% .20 170);
--color-teal-700: oklch(44% .18 170);
--color-teal-800: oklch(35% .15 170);
--color-teal-850: oklch(28% .12 170);
--color-teal-900: oklch(20% .10 170);
--color-teal-950: oklch(15% .07 170);
--color-teal-1000: oklch(11% .05 170);
--color-green-0: oklch(99% .03 140);
--color-green-50: oklch(95% .06 140);
--color-green-100: oklch(90% .12 140);
--color-green-150: oklch(88% .14 140);
--color-green-200: oklch(82% .16 140);
--color-green-300: oklch(78% .17 140);
--color-green-400: oklch(68% .19 140);
--color-green-500: oklch(58% .21 140);
--color-green-600: oklch(52% .20 140);
--color-green-700: oklch(44% .18 140);
--color-green-800: oklch(35% .15 140);
--color-green-850: oklch(28% .12 140);
--color-green-900: oklch(20% .10 140);
--color-green-950: oklch(15% .07 140);
--color-green-1000: oklch(11% .05 140);
--color-lime-0: oklch(99% .03 125);
--color-lime-50: oklch(95% .06 125);
--color-lime-100: oklch(90% .12 125);
--color-lime-150: oklch(88% .14 125);
--color-lime-200: oklch(82% .16 125);
--color-lime-300: oklch(78% .17 125);
--color-lime-400: oklch(68% .19 125);
--color-lime-500: oklch(58% .21 125);
--color-lime-600: oklch(52% .20 125);
--color-lime-700: oklch(44% .18 125);
--color-lime-800: oklch(35% .15 125);
--color-lime-850: oklch(28% .12 125);
--color-lime-900: oklch(20% .10 125);
--color-lime-950: oklch(15% .07 125);
--color-lime-1000: oklch(11% .05 125);
--color-yellow-0: oklch(99% .03 96);
--color-yellow-50: oklch(95% .06 96);
--color-yellow-100: oklch(90% .12 96);
--color-yellow-150: oklch(88% .14 96);
--color-yellow-200: oklch(82% .16 96);
--color-yellow-300: oklch(78% .17 96);
--color-yellow-400: oklch(68% .19 96);
--color-yellow-500: oklch(58% .21 96);
--color-yellow-600: oklch(52% .20 96);
--color-yellow-700: oklch(44% .18 96);
--color-yellow-800: oklch(35% .15 96);
--color-yellow-850: oklch(28% .12 96);
--color-yellow-900: oklch(20% .10 96);
--color-yellow-950: oklch(15% .07 96);
--color-yellow-1000: oklch(11% .05 96);
--color-orange-0: oklch(99% .03 70);
--color-orange-50: oklch(95% .06 70);
--color-orange-100: oklch(90% .12 70);
--color-orange-150: oklch(88% .14 70);
--color-orange-200: oklch(82% .16 70);
--color-orange-300: oklch(78% .17 70);
--color-orange-400: oklch(68% .19 70);
--color-orange-500: oklch(58% .21 70);
--color-orange-600: oklch(52% .20 70);
--color-orange-700: oklch(44% .18 70);
--color-orange-800: oklch(35% .15 70);
--color-orange-850: oklch(28% .12 70);
--color-orange-900: oklch(20% .10 70);
--color-orange-950: oklch(15% .07 70);
--color-orange-1000: oklch(11% .05 70);
--color-red-0: oklch(99% .03 25);
--color-red-50: oklch(95% .06 25);
--color-red-100: oklch(90% .12 25);
--color-red-150: oklch(88% .14 25);
--color-red-200: oklch(82% .16 25);
--color-red-300: oklch(78% .17 25);
--color-red-400: oklch(68% .19 25);
--color-red-500: oklch(58% .21 25);
--color-red-600: oklch(52% .20 25);
--color-red-700: oklch(44% .18 25);
--color-red-800: oklch(35% .15 25);
--color-red-850: oklch(28% .12 25);
--color-red-900: oklch(20% .10 25);
--color-red-950: oklch(15% .07 25);
--color-red-1000: oklch(11% .05 25);
--color-slate-0: oklch(99% 0.006 260);
--color-slate-50: oklch(95% 0.012 260);
--color-slate-100: oklch(90% 0.024 260);
--color-slate-150: oklch(88% 0.028 260);
--color-slate-200: oklch(82% 0.032 260);
--color-slate-300: oklch(78% 0.034 260);
--color-slate-400: oklch(68% 0.038 260);
--color-slate-500: oklch(58% 0.042 260);
--color-slate-600: oklch(52% 0.040 260);
--color-slate-700: oklch(44% 0.036 260);
--color-slate-800: oklch(35% 0.030 260);
--color-slate-850: oklch(28% 0.024 260);
--color-slate-900: oklch(20% 0.020 260);
--color-slate-950: oklch(15% 0.014 260);
--color-slate-1000: oklch(11% 0.010 260);
--color-gray-0: oklch(99% 0.003 260);
--color-gray-50: oklch(95% 0.006 260);
--color-gray-100: oklch(90% 0.012 260);
--color-gray-150: oklch(88% 0.014 260);
--color-gray-200: oklch(82% 0.016 260);
--color-gray-300: oklch(78% 0.017 260);
--color-gray-400: oklch(68% 0.019 260);
--color-gray-500: oklch(58% 0.021 260);
--color-gray-600: oklch(52% 0.020 260);
--color-gray-700: oklch(44% 0.018 260);
--color-gray-800: oklch(35% 0.015 260);
--color-gray-850: oklch(28% 0.012 260);
--color-gray-900: oklch(20% 0.010 260);
--color-gray-950: oklch(15% 0.007 260);
--color-gray-1000: oklch(11% 0.005 260);
--color-stone-0: oklch(99% 0.003 140);
--color-stone-50: oklch(95% 0.006 140);
--color-stone-100: oklch(90% 0.012 140);
--color-stone-150: oklch(88% 0.014 140);
--color-stone-200: oklch(82% 0.016 140);
--color-stone-300: oklch(78% 0.017 140);
--color-stone-400: oklch(68% 0.019 140);
--color-stone-500: oklch(58% 0.021 140);
--color-stone-600: oklch(52% 0.020 140);
--color-stone-700: oklch(44% 0.018 140);
--color-stone-800: oklch(35% 0.015 140);
--color-stone-850: oklch(28% 0.012 140);
--color-stone-900: oklch(20% 0.010 140);
--color-stone-950: oklch(15% 0.007 140);
--color-stone-1000: oklch(11% 0.005 140);
--color-zinc-0: oklch(99% 0.003 25);
--color-zinc-50: oklch(95% 0.006 25);
--color-zinc-100: oklch(90% 0.012 25);
--color-zinc-150: oklch(88% 0.014 25);
--color-zinc-200: oklch(82% 0.016 25);
--color-zinc-300: oklch(78% 0.017 25);
--color-zinc-400: oklch(68% 0.019 25);
--color-zinc-500: oklch(58% 0.021 25);
--color-zinc-600: oklch(52% 0.020 25);
--color-zinc-700: oklch(44% 0.018 25);
--color-zinc-800: oklch(35% 0.015 25);
--color-zinc-850: oklch(28% 0.012 25);
--color-zinc-900: oklch(20% 0.010 25);
--color-zinc-950: oklch(15% 0.007 25);
--color-zinc-1000: oklch(11% 0.005 25);
--ease-xs: cubic-bezier(0.25, 0.1, 0.1, 1);
--ease-sm: cubic-bezier(0.25, 0.1, 0.2, 1);
--ease: cubic-bezier(0.25, 0.1, 0.3, 1);
--ease-lg: cubic-bezier(0.25, 0.1, 0.4, 1);
--ease-xl: cubic-bezier(0.25, 0.1, 0.5, 1);
--ease-in-xs: cubic-bezier(0.3, 0, 1, 1);
--ease-in-sm: cubic-bezier(0.5, 0, 1, 1);
--ease-in: cubic-bezier(0.7, 0, 1, 1);
--ease-in-lg: cubic-bezier(0.9, 0, 1, 1);
--ease-in-xl: cubic-bezier(1, 0, 1, 1);
--ease-out-xs: cubic-bezier(0, 0, 0.7, 1);
--ease-out-sm: cubic-bezier(0, 0, 0.5, 1);
--ease-out: cubic-bezier(0, 0, 0.3, 1);
--ease-out-lg: cubic-bezier(0, 0, 0.1, 1);
--ease-out-xl: cubic-bezier(0, 0, 0, 1);
--ease-in-out-xs: cubic-bezier(0.1, 0, 0.9, 1);
--ease-in-out-sm: cubic-bezier(0.3, 0, 0.7, 1);
--ease-in-out: cubic-bezier(0.5, 0, 0.5, 1);
--ease-in-out-lg: cubic-bezier(0.7, 0, 0.3, 1);
--ease-in-out-xl: cubic-bezier(0.9, 0, 0.1, 1);
--ease-elastic-in-xs: cubic-bezier(0.5, 0.25, 0.75, -0.25);
--ease-elastic-in-sm: cubic-bezier(0.5, 0, 0.75, -0.25);
--ease-elastic-in: cubic-bezier(0.5, -0.25, 0.75, -0.25);
--ease-elastic-in-lg: cubic-bezier(0.5, -0.5, 0.75, -0.25);
--ease-elastic-in-xl: cubic-bezier(0.5, -0.75, 0.75, -0.25);
--ease-elastic-out-xs: cubic-bezier(0.5, 0.75, 0.75, 1.25);
--ease-elastic-out-sm: cubic-bezier(0.5, 1, 0.75, 1.25);
--ease-elastic-out: cubic-bezier(0.5, 1.25, 0.75, 1.25);
--ease-elastic-out-lg: cubic-bezier(0.5, 1.5, 0.75, 1.25);
--ease-elastic-out-xl: cubic-bezier(0.5, 1.75, 0.75, 1.25);
--ease-elastic-in-out-xs: cubic-bezier(0.5, -0.1, 0.1, 1.5);
--ease-elastic-in-out-sm: cubic-bezier(0.5, -0.3, 0.1, 1.5);
--ease-elastic-in-out: cubic-bezier(0.5, -0.5, 0.1, 1.5);
--ease-elastic-in-out-lg: cubic-bezier(0.5, -0.7, 0.1, 1.5);
--ease-elastic-in-out-xl: cubic-bezier(0.5, -0.9, 0.1, 1.5);
--shadow-xs: 0 2px 1px -1px #0001, 0 1px 1px #0001, 0 1px 3px #0001;
--shadow-sm: 0 3px 3px -2px #0001, 0 3px 4px #0001, 0 1px 8px #0001;
--shadow-md: 0 3px 5px -1px #0001, 0 6px 10px #0001, 0 1px 18px #0001;
--shadow-lg: 0 5px 5px -3px #0001, 0 8px 10px 1px #0001, 0 3px 14px 2px #0001;
--shadow-xl: 0 7px 8px -4px #0001, 0 12px 17px 2px #0001, 0 5px 22px 4px #0001;
--shadow-2xl: 0 8px 10px -5px #0001, 0 16px 24px 2px #0001, 0 6px 30px 5px #0001;
--spacing-content: 64ch;
--spacing-heading: 36ch;
--breakpoint-sm: 480px;
--breakpoint-md: 768px;
--breakpoint-lg: 1024px;
--breakpoint-xl: 1440px;
--breakpoint-2xl: 1920px;
}