@fylgja/tokens/jit-props.js

[](https://www.npmjs.com/package/@fylgja/tokens) [](https://www.npmjs.com/package/@fylgja/tokens) [![License](https://img.shields.

export default {
  "--ratio-box": 1,
  "--ratio-landscape": "4/3",
  "--ratio-portrait": "3/4",
  "--ratio-widescreen": "16/9",
  "--ratio-superwide": "21/9",
  "--ratio-ultrawide": "18/5",
  "--ratio-golden": "1.618/1",
  "--border-size-1": "1px",
  "--border-size-2": "2px",
  "--border-size-3": "4px",
  "--border-size-4": "8px",
  "--border-size-5": "12px",
  "--radius-1": "0.125rem",
  "--radius-2": "0.25rem",
  "--radius-3": "0.5rem",
  "--radius-4": "1rem",
  "--radius-5": "2rem",
  "--radius-6": "3rem",
  "--radius-full": "1e5px",
  "--color-0": "oklch(99% calc(.03 * var(--chroma, 1)) var(--hue, 0))",
  "--color-1": "oklch(95% calc(.06 * var(--chroma, 1)) var(--hue, 0))",
  "--color-2": "oklch(90% calc(.12 * var(--chroma, 1)) var(--hue, 0))",
  "--color-3": "oklch(88% calc(.14 * var(--chroma, 1)) var(--hue, 0))",
  "--color-4": "oklch(82% calc(.16 * var(--chroma, 1)) var(--hue, 0))",
  "--color-5": "oklch(78% calc(.17 * var(--chroma, 1)) var(--hue, 0))",
  "--color-6": "oklch(68% calc(.19 * var(--chroma, 1)) var(--hue, 0))",
  "--color-7": "oklch(58% calc(.21 * var(--chroma, 1)) var(--hue, 0))",
  "--color-8": "oklch(52% calc(.20 * var(--chroma, 1)) var(--hue, 0))",
  "--color-9": "oklch(44% calc(.18 * var(--chroma, 1)) var(--hue, 0))",
  "--color-10": "oklch(35% calc(.15 * var(--chroma, 1)) var(--hue, 0))",
  "--color-11": "oklch(28% calc(.12 * var(--chroma, 1)) var(--hue, 0))",
  "--color-12": "oklch(20% calc(.10 * var(--chroma, 1)) var(--hue, 0))",
  "--color-13": "oklch(15% calc(.07 * var(--chroma, 1)) var(--hue, 0))",
  "--color-14": "oklch(11% calc(.05 * var(--chroma, 1)) var(--hue, 0))",
  "--hue-pink": 350,
  "--hue-purple": 330,
  "--hue-violet": 310,
  "--hue-indigo": 290,
  "--hue-blue": 260,
  "--hue-cyan": 220,
  "--hue-teal": 170,
  "--hue-green": 140,
  "--hue-lime": 125,
  "--hue-yellow": 96,
  "--hue-orange": 70,
  "--hue-red": 25,
  "--ease-1": "cubic-bezier(0.25, 0.1, 0.1, 1)",
  "--ease-2": "cubic-bezier(0.25, 0.1, 0.2, 1)",
  "--ease-3": "cubic-bezier(0.25, 0.1, 0.3, 1)",
  "--ease-4": "cubic-bezier(0.25, 0.1, 0.4, 1)",
  "--ease-5": "cubic-bezier(0.25, 0.1, 0.5, 1)",
  "--easeIn-1": "cubic-bezier(0.3, 0, 1, 1)",
  "--easeIn-2": "cubic-bezier(0.5, 0, 1, 1)",
  "--easeIn-3": "cubic-bezier(0.7, 0, 1, 1)",
  "--easeIn-4": "cubic-bezier(0.9, 0, 1, 1)",
  "--easeIn-5": "cubic-bezier(1, 0, 1, 1)",
  "--easeOut-1": "cubic-bezier(0, 0, 0.7, 1)",
  "--easeOut-2": "cubic-bezier(0, 0, 0.5, 1)",
  "--easeOut-3": "cubic-bezier(0, 0, 0.3, 1)",
  "--easeOut-4": "cubic-bezier(0, 0, 0.1, 1)",
  "--easeOut-5": "cubic-bezier(0, 0, 0, 1)",
  "--easeInOut-1": "cubic-bezier(0.1, 0, 0.9, 1)",
  "--easeInOut-2": "cubic-bezier(0.3, 0, 0.7, 1)",
  "--easeInOut-3": "cubic-bezier(0.5, 0, 0.5, 1)",
  "--easeInOut-4": "cubic-bezier(0.7, 0, 0.3, 1)",
  "--easeInOut-5": "cubic-bezier(0.9, 0, 0.1, 1)",
  "--easeElasticIn-1": "cubic-bezier(0.5, 0.25, 0.75, -0.25)",
  "--easeElasticIn-2": "cubic-bezier(0.5, 0, 0.75, -0.25)",
  "--easeElasticIn-3": "cubic-bezier(0.5, -0.25, 0.75, -0.25)",
  "--easeElasticIn-4": "cubic-bezier(0.5, -0.5, 0.75, -0.25)",
  "--easeElasticIn-5": "cubic-bezier(0.5, -0.75, 0.75, -0.25)",
  "--easeElasticOut-1": "cubic-bezier(0.5, 0.75, 0.75, 1.25)",
  "--easeElasticOut-2": "cubic-bezier(0.5, 1, 0.75, 1.25)",
  "--easeElasticOut-3": "cubic-bezier(0.5, 1.25, 0.75, 1.25)",
  "--easeElasticOut-4": "cubic-bezier(0.5, 1.5, 0.75, 1.25)",
  "--easeElasticOut-5": "cubic-bezier(0.5, 1.75, 0.75, 1.25)",
  "--easeElasticInOut-1": "cubic-bezier(0.5, -0.1, 0.1, 1.5)",
  "--easeElasticInOut-2": "cubic-bezier(0.5, -0.3, 0.1, 1.5)",
  "--easeElasticInOut-3": "cubic-bezier(0.5, -0.5, 0.1, 1.5)",
  "--easeElasticInOut-4": "cubic-bezier(0.5, -0.7, 0.1, 1.5)",
  "--easeElasticInOut-5": "cubic-bezier(0.5, -0.9, 0.1, 1.5)",
  "--fontSize-1": "0.875rem",
  "--fontSize-2": "1rem",
  "--fontSize-3": "1.125rem",
  "--fontSize-4": "1.25rem",
  "--fontSize-5": "1.5rem",
  "--fontSize-6": "2rem",
  "--fontSize-7": "2.5rem",
  "--fontSize-8": "3rem",
  "--fontSize-9": "3.5rem",
  "--fontSize-fluid-1": "clamp(0.875rem, 1.5cqi, 1rem)",
  "--fontSize-fluid-2": "clamp(1rem, 2cqi, 1.125rem)",
  "--fontSize-fluid-3": "clamp(1.25rem, 2cqi, 1.5rem)",
  "--fontSize-fluid-4": "clamp(1.5rem, 3cqi, 2rem)",
  "--fontSize-fluid-5": "clamp(2rem, 5cqi, 3.5rem)",
  "--lineHeight-1": "1.1",
  "--lineHeight-2": "1.25",
  "--lineHeight-3": "1.375",
  "--lineHeight-4": "1.5",
  "--lineHeight-5": "1.8",
  "--shadow-color-umbra": "color-mix(in srgb, var(--shadow-color, gray) calc(var(--shadow-strength, 1%) + 20%), #0000)",
  "--shadow-color-penumbra": "color-mix(in srgb, var(--shadow-color, gray) calc(var(--shadow-strength, 1%) + 14%), #0000)",
  "--shadow-color-ambient": "color-mix(in srgb, var(--shadow-color, gray) calc(var(--shadow-strength, 1%) + 12%), #0000)",
  "--shadow-1": [
    "0 2px 1px -1px var(--shadow-color-umbra)",
    "0 1px 1px var(--shadow-color-penumbra)",
    "0 1px 3px var(--shadow-color-ambient)"
  ],
  "--shadow-2": [
    "0 3px 3px -2px var(--shadow-color-umbra)",
    "0 3px 4px var(--shadow-color-penumbra)",
    "0 1px 8px var(--shadow-color-ambient)"
  ],
  "--shadow-3": [
    "0 3px 5px -1px var(--shadow-color-umbra)",
    "0 6px 10px var(--shadow-color-penumbra)",
    "0 1px 18px var(--shadow-color-ambient)"
  ],
  "--shadow-4": [
    "0 5px 5px -3px var(--shadow-color-umbra)",
    "0 8px 10px 1px var(--shadow-color-penumbra)",
    "0 3px 14px 2px var(--shadow-color-ambient)"
  ],
  "--shadow-5": [
    "0 7px 8px -4px var(--shadow-color-umbra)",
    "0 12px 17px 2px var(--shadow-color-penumbra)",
    "0 5px 22px 4px var(--shadow-color-ambient)"
  ],
  "--shadow-6": [
    "0 8px 10px -5px var(--shadow-color-umbra)",
    "0 16px 24px 2px var(--shadow-color-penumbra)",
    "0 6px 30px 5px var(--shadow-color-ambient)"
  ],
  "--spacing": "0.25rem",
  "--size-1": "calc(var(--spacing) * 1)",
  "--size-2": "calc(var(--spacing) * 2)",
  "--size-3": "calc(var(--spacing) * 3)",
  "--size-4": "calc(var(--spacing) * 4)",
  "--size-5": "calc(var(--spacing) * 5)",
  "--size-6": "calc(var(--spacing) * 6)",
  "--size-7": "calc(var(--spacing) * 7)",
  "--size-8": "calc(var(--spacing) * 8)",
  "--size-9": "calc(var(--spacing) * 9)",
  "--size-10": "calc(var(--spacing) * 10)",
  "--size-12": "calc(var(--spacing) * 12)",
  "--size-14": "calc(var(--spacing) * 14)",
  "--size-16": "calc(var(--spacing) * 16)",
  "--size-18": "calc(var(--spacing) * 18)",
  "--size-20": "calc(var(--spacing) * 20)",
  "--size-24": "calc(var(--spacing) * 24)",
  "--size-28": "calc(var(--spacing) * 28)",
  "--size-32": "calc(var(--spacing) * 32)",
  "--size-36": "calc(var(--spacing) * 36)",
  "--size-40": "calc(var(--spacing) * 40)",
  "--size-50": "calc(var(--spacing) * 50)",
  "--size-60": "calc(var(--spacing) * 60)",
  "--size-70": "calc(var(--spacing) * 70)",
  "--size-80": "calc(var(--spacing) * 80)",
  "--size-90": "calc(var(--spacing) * 90)",
  "--size-100": "calc(var(--spacing) * 100)",
  "--size-120": "calc(var(--spacing) * 120)",
  "--size-05": "calc(var(--spacing) * 0.5)",
  "--size-heading": "36ch",
  "--size-content": "64ch",
  "--layer-1": 1,
  "--layer-2": 2,
  "--layer-3": 4,
  "--layer-4": 6,
  "--layer-5": 8
}