UNPKG

@fylgja/tokens

Version:

[![NPM version](https://img.shields.io/npm/v/@fylgja/tokens)](https://www.npmjs.com/package/@fylgja/tokens) [![NPM Downloads](https://img.shields.io/npm/dt/%40fylgja%2Ftokens)](https://www.npmjs.com/package/@fylgja/tokens) [![License](https://img.shields.

299 lines (297 loc) 12.2 kB
@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; }