@postenbring/hedwig-tokens

{ "font-size": { "$type": "dimension", "posten-h1-display": "clamp(40px,calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300))),72px)", "posten-h1-display-min": "40px", "posten-h1-display-max": "72px", "posten-h1": "clamp(32px,calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300))),48px)", "posten-h1-min": "32px", "posten-h1-max": "48px", "posten-h2": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)", "posten-h2-min": "28px", "posten-h2-max": "32px", "bring-h1-display": "clamp(40px,calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300))),72px)", "bring-h1-display-min": "40px", "bring-h1-display-max": "72px", "bring-h1": "clamp(32px,calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300))),48px)", "bring-h1-min": "32px", "bring-h1-max": "48px", "bring-h2": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)", "bring-h2-min": "28px", "bring-h2-max": "32px", "h3": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)", "h3-min": "22px", "h3-max": "24px", "h3-title": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)", "h3-title-min": "22px", "h3-title-max": "24px", "body": "clamp(18px,calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300))),20px)", "body-min": "18px", "body-max": "20px", "body-title": "clamp(18px,calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300))),20px)", "body-title-min": "18px", "body-title-max": "20px", "body-small": "clamp(16px,calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300))),18px)", "body-small-min": "16px", "body-small-max": "18px", "body-small-title": "clamp(16px,calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300))),18px)", "body-small-title-min": "16px", "body-small-title-max": "18px", "technical": "clamp(14px,calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300))),16px)", "technical-min": "14px", "technical-max": "16px", "technical-title": "clamp(14px,calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300))),16px)", "technical-title-min": "14px", "technical-title-max": "16px", "caption": "13px", "caption-title": "13px" }, "line-height": { "$type": "dimension", "posten-h1-display": "clamp(56px,calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300))),80px)", "posten-h1-display-min": "56px", "posten-h1-display-max": "80px", "posten-h1": "clamp(40px,calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300))),56px)", "posten-h1-min": "40px", "posten-h1-max": "56px", "posten-h2": "clamp(36px,calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300))),40px)", "posten-h2-min": "36px", "posten-h2-max": "40px", "bring-h1-display": "clamp(56px,calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300))),80px)", "bring-h1-display-min": "56px", "bring-h1-display-max": "80px", "bring-h1": "clamp(40px,calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300))),56px)", "bring-h1-min": "40px", "bring-h1-max": "56px", "bring-h2": "clamp(36px,calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300))),40px)", "bring-h2-min": "36px", "bring-h2-max": "40px", "h3": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)", "h3-min": "28px", "h3-max": "32px", "h3-title": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)", "h3-title-min": "28px", "h3-title-max": "32px", "body": "clamp(26px,calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300))),28px)", "body-min": "26px", "body-max": "28px", "body-title": "clamp(26px,calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300))),28px)", "body-title-min": "26px", "body-title-max": "28px", "body-small": "clamp(24px,calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300))),26px)", "body-small-min": "24px", "body-small-max": "26px", "body-small-title": "clamp(24px,calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300))),26px)", "body-small-title-min": "24px", "body-small-title-max": "26px", "technical": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)", "technical-min": "22px", "technical-max": "24px", "technical-title": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)", "technical-title-min": "22px", "technical-title-max": "24px", "caption": "18px", "caption-title": "18px" }, "font-weight": { "$type": "number", "posten-h1-display": 700, "posten-h1": 700, "posten-h2": 700, "bring-h1-display": 500, "bring-h1": 500, "bring-h2": 500, "h3": 400, "h3-title": 500, "body": 400, "body-title": 500, "body-small": 400, "body-small-title": 500, "technical": 400, "technical-title": 500, "caption": 400, "caption-title": 500 }, "posten-colors": { "$type": "color", "_deprecated": true, "signature-red": "#e32d22", "darker-red": "#4a1011", "dark-red": "#980000", "light-red": "#ffb5af", "lighter-red": "#fff5f0", "signature-red-hover": "#ca201c", "light-red-hover": "#ffa199" }, "bring-colors": { "$type": "color", "_deprecated": true, "signature-green": "#56b529", "darker-green": "#002f19", "dark-green": "#00643a", "light-green": "#b5e099", "lighter-green": "#f1f7e9", "signature-green-hover": "#6ec943", "light-green-hover": "#d3e593" }, "ui-colors": { "$type": "color", "_deprecated": true, "black": "#000000", "dark-grey": "#6e6e6e", "grey": "#d6d6d6", "light-grey-stroke": "#e4e4e4", "light-grey-fill": "#f2f2f2", "white": "#ffffff", "warning-yellow": "#fdbb2f", "warning-yellow-stroke": "#d68000", "warning-yellow-light-fill": "#fff5e0", "warning-yellow-hover": "#ffc340", "black-hover": "#1e1e1e" }, "dark-mode-colors": { "$type": "color", "_deprecated": true, "obsidian": "#121212", "coal": "#252525", "dusk": "#2c2c2c", "spider": "#333333", "ash": "#999999" }, "breakpoint": { "$type": "dimension", "small": "460px", "medium": "720px", "large": "940px", "xlarge": "1200px" }, "spacing": { "4": "4px", "8": "8px", "12": "12px", "16": "16px", "20": "20px", "24": "24px", "32": "32px", "40": "40px", "48": "48px", "64": "64px", "80": "80px", "120": "120px", "160": "160px", "$type": "dimension" }, "navbar-height": "112px", "fonts": { "$type": "fontFamily", "posten-sans": [ "Posten Sans", "Arial", "sans-serif" ], "posten-sans-bold": [ "Posten Sans Bold", "Arial", "sans-serif" ], "posten-sans-medium": [ "Posten Sans Medium", "Arial", "sans-serif" ], "posten-sans-regular": [ "Posten Sans Regular", "Arial", "sans-serif" ] }, "typography": { "$type": "typography", "posten-h1-display": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "40px", "72px" ], "lineHeight": [ "56px", "80px" ], "fontWeight": 700, "letterSpacing": "0" }, "posten-h1": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "32px", "48px" ], "lineHeight": [ "40px", "56px" ], "fontWeight": 700, "letterSpacing": "0" }, "posten-h2": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "28px", "32px" ], "lineHeight": [ "36px", "40px" ], "fontWeight": 700, "letterSpacing": "0" }, "bring-h1-display": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "40px", "72px" ], "lineHeight": [ "56px", "80px" ], "fontWeight": 500, "letterSpacing": "0" }, "bring-h1": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "32px", "48px" ], "lineHeight": [ "40px", "56px" ], "fontWeight": 500, "letterSpacing": "0" }, "bring-h2": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "28px", "32px" ], "lineHeight": [ "36px", "40px" ], "fontWeight": 500, "letterSpacing": "0" }, "h3": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "22px", "24px" ], "lineHeight": [ "28px", "32px" ], "fontWeight": 400, "letterSpacing": "0" }, "h3-title": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "22px", "24px" ], "lineHeight": [ "28px", "32px" ], "fontWeight": 500, "letterSpacing": "0" }, "body": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "18px", "20px" ], "lineHeight": [ "26px", "28px" ], "fontWeight": 400, "letterSpacing": "0" }, "body-title": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "18px", "20px" ], "lineHeight": [ "26px", "28px" ], "fontWeight": 500, "letterSpacing": "0" }, "body-small": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "16px", "18px" ], "lineHeight": [ "24px", "26px" ], "fontWeight": 400, "letterSpacing": "0" }, "body-small-title": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "16px", "18px" ], "lineHeight": [ "24px", "26px" ], "fontWeight": 500, "letterSpacing": "0" }, "technical": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "14px", "16px" ], "lineHeight": [ "22px", "24px" ], "fontWeight": 400, "letterSpacing": "0" }, "technical-title": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": [ "14px", "16px" ], "lineHeight": [ "22px", "24px" ], "fontWeight": 500, "letterSpacing": "0" }, "caption": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": "13px", "lineHeight": "18px", "fontWeight": 400, "letterSpacing": "0" }, "caption-title": { "fontFamily": [ "Posten Sans", "Arial", "sans-serif" ], "fontSize": "13px", "lineHeight": "18px", "fontWeight": 500, "letterSpacing": "0" } }, "border-radius": { "8": "8px", "16": "16px", "24": "24px", "32": "32px", "$type": "dimension", "_": "2px" }, "stroke-default": "1px", "stroke-thick": "2px", "shadow-default": "0px 1px 5px 0px #00000022", "micro-animation": { "$type": "cubicBezier", "easing-in": "cubic-bezier(0.65, 0, 1, 0.1)", "easing-out": "cubic-bezier(0, 0.45, 0.1, 1)", "easing-normal": "cubic-bezier(0.45, 0.1, 0.65, 1)" }, "micro-animation-duration": { "$type": "time", "quick": "0.130s", "normal": "0.300s", "slow": "0.700s" }, "opacity": { "7": ".07", "10": ".1", "20": ".2", "50": ".5" }, "colors-bring": { "$type": "color", "colorScheme": "light", "bg-default": "#FFFFFF", "bg-tinted": "#F1F7E9", "surface-default": "#F1F7E9", "surface-tinted": "#DDF1D0", "surface-hover": "#C6E7B1", "surface-active": "#B5E099", "border-default": "#56B529", "border-strong": "#00643A", "text-subtle": "#00643A", "text-default": "#002F19", "base-default": "#6EC943", "base-hover": "#56B529", "base-active": "#B5E099", "base-contrast-default": "#000000" }, "colors-posten": { "$type": "color", "colorScheme": "light", "bg-default": "#FFFFFF", "bg-tinted": "#FFF5F0", "surface-default": "#FFF5F0", "surface-tinted": "#FFE3E0", "surface-hover": "#FCD3CF", "surface-active": "#FFB5AF", "border-default": "#E32D22", "border-strong": "#980000", "text-subtle": "#980000", "text-default": "#4A1011", "base-default": "#E32D22", "base-hover": "#CA201C", "base-active": "#980000", "base-contrast-default": "#FFFFFF" }, "colors-neutral": { "$type": "color", "colorScheme": "light", "bg-default": "#FFFFFF", "bg-tinted": "#F7F7F7", "surface-default": "#FFFFFF", "surface-tinted": "#F7F7F7", "surface-hover": "#F2F2F2", "surface-active": "#E6E6E6", "border-default": "#D6D6D6", "border-strong": "#666666", "text-subtle": "#666666", "text-default": "#000000", "base-default": "#E6E6E6", "base-hover": "#D6D6D6", "base-active": "#C1C1C1", "base-contrast-default": "#121212" }, "colors-warning": { "$type": "color", "colorScheme": "light", "surface-default": "#FFF5E0", "border-default": "#D68000", "border-strong": "#666666", "text-default": "#121212", "base-default": "#FDBB2F", "base-contrast-default": "#121212" }, "colors-success": { "$type": "color", "colorScheme": "light", "surface-default": "#F1F7E9", "border-default": "#C6E7B1", "border-strong": "#00643A", "text-default": "#00643A", "base-default": "#B5E099", "base-contrast-default": "#002F19" }, "colors-info": { "$type": "color", "colorScheme": "light", "surface-default": "#EFEEFF", "border-default": "#C6C2FF", "border-strong": "#7167FE", "text-default": "#002CA3", "base-default": "#FFF5E0", "base-contrast-default": "#121212" }, "colors-error": { "$type": "color", "colorScheme": "light", "surface-default": "#FFF5F0", "border-default": "#FFB5AF", "border-strong": "#980000", "text-default": "#980000", "base-default": "#980000", "base-contrast-default": "#FFFFFF" }, "colors-bring-dark": { "$type": "color", "colorScheme": "dark", "bg-default": "#121212", "bg-tinted": "#222222", "surface-default": "#333333", "surface-tinted": "#002F19", "surface-hover": "#222222", "surface-active": "#3D3D3D", "border-default": "#56B529", "border-strong": "#C6E7B1", "text-subtle": "#C6E7B1", "text-default": "#F1F7E9", "base-default": "#6EC943", "base-hover": "#56B529", "base-active": "#B5E099", "base-contrast-default": "#000000" }, "colors-posten-dark": { "$type": "color", "colorScheme": "dark", "bg-default": "#121212", "bg-tinted": "#222222", "surface-default": "#333333", "surface-tinted": "#4A1011", "surface-hover": "#222222", "surface-active": "#3D3D3D", "border-default": "#E32D22", "border-strong": "#FCD3CF", "text-subtle": "#FCD3CF", "text-default": "#FFF5F0", "base-default": "#E32D22", "base-hover": "#CA201C", "base-active": "#980000", "base-contrast-default": "#FFFFFF" }, "colors-neutral-dark": { "$type": "color", "colorScheme": "dark", "bg-default": "#121212", "bg-tinted": "#222222", "surface-default": "#2C2C2C", "surface-tinted": "#333333", "surface-hover": "#3D3D3D", "surface-active": "#666666", "border-default": "#666666", "border-strong": "#D6D6D6", "text-subtle": "#D6D6D6", "text-default": "#FFFFFF", "base-default": "#222222", "base-hover": "#3D3D3D", "base-active": "#666666", "base-contrast-default": "#F7F7F7" }, "colors-warning-dark": { "$type": "color", "colorScheme": "dark", "surface-default": "#3D3D3D", "border-default": "#D68000", "border-strong": "#FDBB2F", "text-default": "#FFE2A3", "base-default": "#FDBB2F", "base-contrast-default": "#121212" }, "colors-success-dark": { "$type": "color", "colorScheme": "dark", "surface-default": "#00643A", "border-default": "#00643A", "border-strong": "#C6E7B1", "text-default": "#B5E099", "base-default": "#B5E099", "base-contrast-default": "#002F19" }, "colors-info-dark": { "$type": "color", "colorScheme": "dark", "surface-default": "#3D3D3D", "border-default": "#C6C2FF", "border-strong": "#EFEEFF", "text-default": "#C6C2FF", "base-default": "#C6C2FF", "base-contrast-default": "#121212" }, "colors-error-dark": { "$type": "color", "colorScheme": "dark", "surface-default": "#4A1011", "border-default": "#980000", "border-strong": "#FFB5AF", "text-default": "#FCD3CF", "base-default": "#980000", "base-contrast-default": "#FFFFFF" } }