@cloudfour/patterns
Version:
Front-end patterns for cloudfour.com
3,702 lines • 97.7 kB
JavaScript
export default {
"color": {
"base": {
"blue_lighter": {
"value": "#8abfff",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#8abfff",
"comment": "Accessible on -darker colors."
},
"name": "color-base-blue-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "blue_lighter"
},
"path": [
"color",
"base",
"blue_lighter"
]
},
"blue_light": {
"value": "#3d84f5",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#3d84F5"
},
"name": "color-base-blue-light",
"attributes": {
"category": "color",
"type": "base",
"item": "blue_light"
},
"path": [
"color",
"base",
"blue_light"
]
},
"blue": {
"value": "#215cca",
"comment": "Accessible on white and lighter-gray.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#215cca",
"comment": "Accessible on white and lighter-gray."
},
"name": "color-base-blue",
"attributes": {
"category": "color",
"type": "base",
"item": "blue"
},
"path": [
"color",
"base",
"blue"
]
},
"blue_dark": {
"value": "#183889",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#183889",
"comment": "Accessible on white."
},
"name": "color-base-blue-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "blue_dark"
},
"path": [
"color",
"base",
"blue_dark"
]
},
"blue_darker": {
"value": "#0e1c43",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#0E1C43",
"comment": "Accessible on white."
},
"name": "color-base-blue-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "blue_darker"
},
"path": [
"color",
"base",
"blue_darker"
]
},
"green_lighter": {
"value": "#71f4ae",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#71f4ae",
"comment": "Accessible on -darker colors."
},
"name": "color-base-green-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "green_lighter"
},
"path": [
"color",
"base",
"green_lighter"
]
},
"green_light": {
"value": "#2cdd90",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#2cdd90"
},
"name": "color-base-green-light",
"attributes": {
"category": "color",
"type": "base",
"item": "green_light"
},
"path": [
"color",
"base",
"green_light"
]
},
"green": {
"value": "#158466",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#158466",
"comment": "Accessible on white."
},
"name": "color-base-green",
"attributes": {
"category": "color",
"type": "base",
"item": "green"
},
"path": [
"color",
"base",
"green"
]
},
"green_dark": {
"value": "#105c52",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#105c52",
"comment": "Accessible on white."
},
"name": "color-base-green-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "green_dark"
},
"path": [
"color",
"base",
"green_dark"
]
},
"green_darker": {
"value": "#0c3538",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#0c3538",
"comment": "Accessible on white."
},
"name": "color-base-green-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "green_darker"
},
"path": [
"color",
"base",
"green_darker"
]
},
"purple_lighter": {
"value": "#e98efa",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#e98efa",
"comment": "Accessible on -darker colors."
},
"name": "color-base-purple-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "purple_lighter"
},
"path": [
"color",
"base",
"purple_lighter"
]
},
"purple_light": {
"value": "#d250f7",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#d250f7"
},
"name": "color-base-purple-light",
"attributes": {
"category": "color",
"type": "base",
"item": "purple_light"
},
"path": [
"color",
"base",
"purple_light"
]
},
"purple": {
"value": "#950cde",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#950cde",
"comment": "Accessible on white."
},
"name": "color-base-purple",
"attributes": {
"category": "color",
"type": "base",
"item": "purple"
},
"path": [
"color",
"base",
"purple"
]
},
"purple_dark": {
"value": "#560a9b",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#560a9b",
"comment": "Accessible on white."
},
"name": "color-base-purple-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "purple_dark"
},
"path": [
"color",
"base",
"purple_dark"
]
},
"purple_darker": {
"value": "#2a085e",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#2a085e",
"comment": "Accessible on white."
},
"name": "color-base-purple-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "purple_darker"
},
"path": [
"color",
"base",
"purple_darker"
]
},
"fuchsia_lighter": {
"value": "#ff80ca",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#ff80ca",
"comment": "Accessible on -darker colors."
},
"name": "color-base-fuchsia-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "fuchsia_lighter"
},
"path": [
"color",
"base",
"fuchsia_lighter"
]
},
"fuchsia_light": {
"value": "#f240ae",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#f240ae"
},
"name": "color-base-fuchsia-light",
"attributes": {
"category": "color",
"type": "base",
"item": "fuchsia_light"
},
"path": [
"color",
"base",
"fuchsia_light"
]
},
"fuchsia": {
"value": "#d9118f",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#d9118f",
"comment": "Accessible on white."
},
"name": "color-base-fuchsia",
"attributes": {
"category": "color",
"type": "base",
"item": "fuchsia"
},
"path": [
"color",
"base",
"fuchsia"
]
},
"fuchsia_dark": {
"value": "#950f7d",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#950f7d",
"comment": "Accessible on white."
},
"name": "color-base-fuchsia-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "fuchsia_dark"
},
"path": [
"color",
"base",
"fuchsia_dark"
]
},
"fuchsia_darker": {
"value": "#5c0a5c",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#5c0a5c",
"comment": "Accessible on white."
},
"name": "color-base-fuchsia-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "fuchsia_darker"
},
"path": [
"color",
"base",
"fuchsia_darker"
]
},
"orange_lighter": {
"value": "#ffad5c",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#ffad5c",
"comment": "Accessible on -darker colors."
},
"name": "color-base-orange-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "orange_lighter"
},
"path": [
"color",
"base",
"orange_lighter"
]
},
"orange_light": {
"value": "#fa8f47",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#fa8f47"
},
"name": "color-base-orange-light",
"attributes": {
"category": "color",
"type": "base",
"item": "orange_light"
},
"path": [
"color",
"base",
"orange_light"
]
},
"orange": {
"value": "#f27041",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#f27041"
},
"name": "color-base-orange",
"attributes": {
"category": "color",
"type": "base",
"item": "orange"
},
"path": [
"color",
"base",
"orange"
]
},
"orange_dark": {
"value": "#aa3f24",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#aa3f24",
"comment": "Accessible on white."
},
"name": "color-base-orange-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "orange_dark"
},
"path": [
"color",
"base",
"orange_dark"
]
},
"orange_darker": {
"value": "#622018",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#622018",
"comment": "Accessible on white."
},
"name": "color-base-orange-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "orange_darker"
},
"path": [
"color",
"base",
"orange_darker"
]
},
"gray_lighter": {
"value": "#f2f5f7",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#f2f5f7",
"comment": "Accessible on -darker colors."
},
"name": "color-base-gray-lighter",
"attributes": {
"category": "color",
"type": "base",
"item": "gray_lighter"
},
"path": [
"color",
"base",
"gray_lighter"
]
},
"gray_light": {
"value": "#c0cfd8",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#c0cfd8"
},
"name": "color-base-gray-light",
"attributes": {
"category": "color",
"type": "base",
"item": "gray_light"
},
"path": [
"color",
"base",
"gray_light"
]
},
"gray": {
"value": "#738da0",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#738da0"
},
"name": "color-base-gray",
"attributes": {
"category": "color",
"type": "base",
"item": "gray"
},
"path": [
"color",
"base",
"gray"
]
},
"gray_dark": {
"value": "#485968",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#485968",
"comment": "Accessible on white."
},
"name": "color-base-gray-dark",
"attributes": {
"category": "color",
"type": "base",
"item": "gray_dark"
},
"path": [
"color",
"base",
"gray_dark"
]
},
"gray_darker": {
"value": "#252b32",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#252b32",
"comment": "Accessible on white."
},
"name": "color-base-gray-darker",
"attributes": {
"category": "color",
"type": "base",
"item": "gray_darker"
},
"path": [
"color",
"base",
"gray_darker"
]
},
"black": {
"value": "#000000",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#000"
},
"name": "color-base-black",
"attributes": {
"category": "color",
"type": "base",
"item": "black"
},
"path": [
"color",
"base",
"black"
]
},
"black_transparent_60": {
"value": "rgba(0, 0, 0, 0.6)",
"comment": "Intended for placeholder text in inputs. Use cautiously and always test combinations for contrast.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "rgba(0, 0, 0, 0.60)",
"comment": "Intended for placeholder text in inputs. Use cautiously and always test combinations for contrast."
},
"name": "color-base-black-transparent-60",
"attributes": {
"category": "color",
"type": "base",
"item": "black_transparent_60"
},
"path": [
"color",
"base",
"black_transparent_60"
]
},
"black_transparent_85": {
"value": "rgba(0, 0, 0, 0.85)",
"comment": "Accessible on white and lightest gray.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "rgba(0, 0, 0, 0.85)",
"comment": "Accessible on white and lightest gray."
},
"name": "color-base-black-transparent-85",
"attributes": {
"category": "color",
"type": "base",
"item": "black_transparent_85"
},
"path": [
"color",
"base",
"black_transparent_85"
]
},
"white": {
"value": "#ffffff",
"comment": "Accessible on primary brand color, useful for buttons and headings.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "#fff",
"comment": "Accessible on primary brand color, useful for buttons and headings."
},
"name": "color-base-white",
"attributes": {
"category": "color",
"type": "base",
"item": "white"
},
"path": [
"color",
"base",
"white"
]
},
"white_transparent_85": {
"value": "rgba(255, 255, 255, 0.85)",
"comment": "Accessible on primary brand color.",
"filePath": "src/tokens/color/base.json",
"isSource": true,
"original": {
"value": "rgba(255, 255, 255, 0.85)",
"comment": "Accessible on primary brand color."
},
"name": "color-base-white-transparent-85",
"attributes": {
"category": "color",
"type": "base",
"item": "white_transparent_85"
},
"path": [
"color",
"base",
"white_transparent_85"
]
}
},
"brand": {
"primary_lighter": {
"value": "#8abfff",
"comment": "Accessible on -darker colors.",
"filePath": "src/tokens/color/brand.js",
"isSource": true,
"original": {
"value": "{color.base.blue_lighter.value}",
"comment": "Accessible on -darker colors."
},
"name": "color-brand-primary-lighter",
"attributes": {
"category": "color",
"type": "brand",
"item": "primary_lighter"
},
"path": [
"color",
"brand",
"primary_lighter"
]
},
"primary_light": {
"value": "#3d84f5",
"filePath": "src/tokens/color/brand.js",
"isSource": true,
"original": {
"value": "{color.base.blue_light.value}"
},
"name": "color-brand-primary-light",
"attributes": {
"category": "color",
"type": "brand",
"item": "primary_light"
},
"path": [
"color",
"brand",
"primary_light"
]
},
"primary": {
"value": "#215cca",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/brand.js",
"isSource": true,
"original": {
"value": "{color.base.blue.value}",
"comment": "Accessible on white."
},
"name": "color-brand-primary",
"attributes": {
"category": "color",
"type": "brand",
"item": "primary"
},
"path": [
"color",
"brand",
"primary"
]
},
"primary_dark": {
"value": "#183889",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/brand.js",
"isSource": true,
"original": {
"value": "{color.base.blue_dark.value}",
"comment": "Accessible on white."
},
"name": "color-brand-primary-dark",
"attributes": {
"category": "color",
"type": "brand",
"item": "primary_dark"
},
"path": [
"color",
"brand",
"primary_dark"
]
},
"primary_darker": {
"value": "#0e1c43",
"comment": "Accessible on white.",
"filePath": "src/tokens/color/brand.js",
"isSource": true,
"original": {
"value": "{color.base.blue_darker.value}",
"comment": "Accessible on white."
},
"name": "color-brand-primary-darker",
"attributes": {
"category": "color",
"type": "brand",
"item": "primary_darker"
},
"path": [
"color",
"brand",
"primary_darker"
]
}
},
"status": {
"error_dark": {
"value": "#bc1919",
"filePath": "src/tokens/color/status.json",
"isSource": true,
"original": {
"value": "#bc1919"
},
"name": "color-status-error-dark",
"attributes": {
"category": "color",
"type": "status",
"item": "error_dark"
},
"path": [
"color",
"status",
"error_dark"
]
},
"error_light": {
"value": "#ffcaca",
"filePath": "src/tokens/color/status.json",
"isSource": true,
"original": {
"value": "#ffcaca"
},
"name": "color-status-error-light",
"attributes": {
"category": "color",
"type": "status",
"item": "error_light"
},
"path": [
"color",
"status",
"error_light"
]
}
},
"text": {
"dark": {
"value": "rgba(0, 0, 0, 0.85)",
"comment": "Accessible on white and lightest gray.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "{color.base.black_transparent_85.value}",
"comment": "Accessible on white and lightest gray."
},
"name": "color-text-dark",
"attributes": {
"category": "color",
"type": "text",
"item": "dark"
},
"path": [
"color",
"text",
"dark"
]
},
"dark_muted": {
"value": "rgba(0, 0, 0, 0.6)",
"comment": "Intended for placeholder text in inputs. Use cautiously and always test combinations for contrast.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "{color.base.black_transparent_60.value}",
"comment": "Intended for placeholder text in inputs. Use cautiously and always test combinations for contrast."
},
"name": "color-text-dark-muted",
"attributes": {
"category": "color",
"type": "text",
"item": "dark_muted"
},
"path": [
"color",
"text",
"dark_muted"
]
},
"light": {
"value": "rgba(255, 255, 255, 0.85)",
"comment": "Accessible on primary brand color.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "{color.base.white_transparent_85.value}",
"comment": "Accessible on primary brand color."
},
"name": "color-text-light",
"attributes": {
"category": "color",
"type": "text",
"item": "light"
},
"path": [
"color",
"text",
"light"
]
},
"light_emphasis": {
"value": "#ffffff",
"comment": "Accessible on primary brand color, useful for buttons and headings.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "{color.base.white.value}",
"comment": "Accessible on primary brand color, useful for buttons and headings."
},
"name": "color-text-light-emphasis",
"attributes": {
"category": "color",
"type": "text",
"item": "light_emphasis"
},
"path": [
"color",
"text",
"light_emphasis"
]
},
"action": {
"value": "#215cca",
"comment": "Accessible on white and lighter-gray.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "{color.base.blue.value}",
"comment": "Accessible on white and lighter-gray."
},
"name": "color-text-action",
"attributes": {
"category": "color",
"type": "text",
"item": "action"
},
"path": [
"color",
"text",
"action"
]
},
"code": {
"value": "rgba(202, 2, 129, 0.94)",
"comment": "Similar to the base fuchsia, but accessible on white and lighter-gray.",
"filePath": "src/tokens/color/text.json",
"isSource": true,
"original": {
"value": "hsla(322, 98%, 40%, 0.94)",
"comment": "Similar to the base fuchsia, but accessible on white and lighter-gray."
},
"name": "color-text-code",
"attributes": {
"category": "color",
"type": "text",
"item": "code"
},
"path": [
"color",
"text",
"code"
]
}
}
},
"ease": {
"in_out": {
"value": "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
"comment": "https://easings.net/en#easeInOutQuad",
"filePath": "src/tokens/ease/ease.js",
"isSource": true,
"original": {
"value": "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
"comment": "https://easings.net/en#easeInOutQuad"
},
"name": "ease-in-out",
"attributes": {
"category": "ease",
"type": "in_out"
},
"path": [
"ease",
"in_out"
]
},
"in": {
"value": "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
"comment": "https://easings.net/en#easeInQuad",
"filePath": "src/tokens/ease/ease.js",
"isSource": true,
"original": {
"value": "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
"comment": "https://easings.net/en#easeInQuad"
},
"name": "ease-in",
"attributes": {
"category": "ease",
"type": "in"
},
"path": [
"ease",
"in"
]
},
"out": {
"value": "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
"comment": "https://easings.net/en#easeOutQuad",
"filePath": "src/tokens/ease/ease.js",
"isSource": true,
"original": {
"value": "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
"comment": "https://easings.net/en#easeOutQuad"
},
"name": "ease-out",
"attributes": {
"category": "ease",
"type": "out"
},
"path": [
"ease",
"out"
]
},
"in_out_sine": {
"value": "cubic-bezier(0.37, 0, 0.63, 1)",
"comment": "https://easings.net/#easeInOutSine",
"filePath": "src/tokens/ease/ease.js",
"isSource": true,
"original": {
"value": "cubic-bezier(0.37, 0, 0.63, 1)",
"comment": "https://easings.net/#easeInOutSine"
},
"name": "ease-in-out-sine",
"attributes": {
"category": "ease",
"type": "in_out_sine"
},
"path": [
"ease",
"in_out_sine"
]
},
"out_sine": {
"value": "cubic-bezier(0.61, 1, 0.88, 1)",
"comment": "https://easings.net/#easeOutSine",
"filePath": "src/tokens/ease/ease.js",
"isSource": true,
"original": {
"value": "cubic-bezier(0.61, 1, 0.88, 1)",
"comment": "https://easings.net/#easeOutSine"
},
"name": "ease-out-sine",
"attributes": {
"category": "ease",
"type": "out_sine"
},
"path": [
"ease",
"out_sine"
]
}
},
"font": {
"family": {
"sans": {
"value": "'Source Sans Pro Variable', Tahoma, 'Helvetica Neue', Helvetica, Arial, sans-serif",
"comment": "Variable font. Supports weights 100 through 900.",
"filePath": "src/tokens/font/family.json",
"isSource": true,
"original": {
"value": "'Source Sans Pro Variable', Tahoma, 'Helvetica Neue', Helvetica, Arial, sans-serif",
"comment": "Variable font. Supports weights 100 through 900."
},
"name": "font-family-sans",
"attributes": {
"category": "font",
"type": "family",
"item": "sans"
},
"path": [
"font",
"family",
"sans"
]
},
"sans_fallback": {
"value": "'Source Sans Pro', Tahoma, 'Helvetica Neue', Helvetica, Arial, sans-serif",
"comment": "When variable fonts are not supported. Only certain weights are available.",
"filePath": "src/tokens/font/family.json",
"isSource": true,
"original": {
"value": "'Source Sans Pro', Tahoma, 'Helvetica Neue', Helvetica, Arial, sans-serif",
"comment": "When variable fonts are not supported. Only certain weights are available."
},
"name": "font-family-sans-fallback",
"attributes": {
"category": "font",
"type": "family",
"item": "sans_fallback"
},
"path": [
"font",
"family",
"sans_fallback"
]
},
"mono": {
"value": "'Source Code Pro', Monaco, Consolas, 'Lucida Console', 'Andale Mono', monospace",
"comment": "For source code previews.",
"filePath": "src/tokens/font/family.json",
"isSource": true,
"original": {
"value": "'Source Code Pro', Monaco, Consolas, 'Lucida Console', 'Andale Mono', monospace",
"comment": "For source code previews."
},
"name": "font-family-mono",
"attributes": {
"category": "font",
"type": "family",
"item": "mono"
},
"path": [
"font",
"family",
"mono"
]
}
}
},
"number": {
"aspect_ratio": {
"square": {
"value": 1,
"filePath": "src/tokens/number/aspect-ratio.js",
"isSource": true,
"original": {
"value": 1
},
"name": "number-aspect-ratio-square",
"attributes": {
"category": "number",
"type": "aspect_ratio",
"item": "square"
},
"path": [
"number",
"aspect_ratio",
"square"
]
},
"full": {
"value": 1.3333333333333333,
"comment": "4:3 (\"fullscreen\")",
"filePath": "src/tokens/number/aspect-ratio.js",
"isSource": true,
"original": {
"value": 1.3333333333333333,
"comment": "4:3 (\"fullscreen\")"
},
"name": "number-aspect-ratio-full",
"attributes": {
"category": "number",
"type": "aspect_ratio",
"item": "full"
},
"path": [
"number",
"aspect_ratio",
"full"
]
},
"wide": {
"value": 1.7777777777777777,
"comment": "16:9 (\"widescreen\")",
"filePath": "src/tokens/number/aspect-ratio.js",
"isSource": true,
"original": {
"value": 1.7777777777777777,
"comment": "16:9 (\"widescreen\")"
},
"name": "number-aspect-ratio-wide",
"attributes": {
"category": "number",
"type": "aspect_ratio",
"item": "wide"
},
"path": [
"number",
"aspect_ratio",
"wide"
]
},
"cinema": {
"value": 2,
"filePath": "src/tokens/number/aspect-ratio.js",
"isSource": true,
"original": {
"value": 2
},
"name": "number-aspect-ratio-cinema",
"attributes": {
"category": "number",
"type": "aspect_ratio",
"item": "cinema"
},
"path": [
"number",
"aspect_ratio",
"cinema"
]
}
},
"brightness": {
"control": {
"brighten": {
"value": "110%",
"filePath": "src/tokens/number/brightness.json",
"isSource": true,
"original": {
"value": "110%"
},
"name": "number-brightness-control-brighten",
"attributes": {
"category": "number",
"type": "brightness",
"item": "control",
"subitem": "brighten"
},
"path": [
"number",
"brightness",
"control",
"brighten"
]
},
"dim": {
"value": "80%",
"filePath": "src/tokens/number/brightness.json",
"isSource": true,
"original": {
"value": "80%"
},
"name": "number-brightness-control-dim",
"attributes": {
"category": "number",
"type": "brightness",
"item": "control",
"subitem": "dim"
},
"path": [
"number",
"brightness",
"control",
"dim"
]
}
},
"image": {
"brighten": {
"value": "102.5%",
"filePath": "src/tokens/number/brightness.json",
"isSource": true,
"original": {
"value": "102.5%"
},
"name": "number-brightness-image-brighten",
"attributes": {
"category": "number",
"type": "brightness",
"item": "image",
"subitem": "brighten"
},
"path": [
"number",
"brightness",
"image",
"brighten"
]
}
}
},
"font_weight": {
"light": {
"value": "300",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "300"
},
"name": "number-font-weight-light",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "light"
},
"path": [
"number",
"font_weight",
"light"
]
},
"normal": {
"value": "400",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "400"
},
"name": "number-font-weight-normal",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "normal"
},
"path": [
"number",
"font_weight",
"normal"
]
},
"medium": {
"value": "500",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "500"
},
"name": "number-font-weight-medium",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "medium"
},
"path": [
"number",
"font_weight",
"medium"
]
},
"semibold": {
"value": "600",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "600"
},
"name": "number-font-weight-semibold",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "semibold"
},
"path": [
"number",
"font_weight",
"semibold"
]
},
"bold": {
"value": "700",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "700"
},
"name": "number-font-weight-bold",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "bold"
},
"path": [
"number",
"font_weight",
"bold"
]
},
"heavy": {
"value": "800",
"filePath": "src/tokens/number/font-weight.json",
"isSource": true,
"original": {
"value": "800"
},
"name": "number-font-weight-heavy",
"attributes": {
"category": "number",
"type": "font_weight",
"item": "heavy"
},
"path": [
"number",
"font_weight",
"heavy"
]
}
},
"line_height": {
"loose": {
"value": 1.5625,
"comment": "For multiline copy.",
"filePath": "src/tokens/number/line-height.js",
"isSource": true,
"original": {
"value": 1.5625,
"comment": "For multiline copy."
},
"name": "number-line-height-loose",
"attributes": {
"category": "number",
"type": "line_height",
"item": "loose"
},
"path": [
"number",
"line_height",
"loose"
]
},
"tight": {
"value": 1.25,
"comment": "For headings and single-line text.",
"filePath": "src/tokens/number/line-height.js",
"isSource": true,
"original": {
"value": 1.25,
"comment": "For headings and single-line text."
},
"name": "number-line-height-tight",
"attributes": {
"category": "number",
"type": "line_height",
"item": "tight"
},
"path": [
"number",
"line_height",
"tight"
]
},
"tighter": {
"value": 1,
"comment": "For very large headings or UI elements with built-in height or padding.",
"filePath": "src/tokens/number/line-height.js",
"isSource": true,
"original": {
"value": 1,
"comment": "For very large headings or UI elements with built-in height or padding."
},
"name": "number-line-height-tighter",
"attributes": {
"category": "number",
"type": "line_height",
"item": "tighter"
},
"path": [
"number",
"line_height",
"tighter"
]
}
},
"opacity": {
"muted": {
"value": "0.65",
"filePath": "src/tokens/number/opacity.json",
"isSource": true,
"original": {
"value": "0.65"
},
"name": "number-opacity-muted",
"attributes": {
"category": "number",
"type": "opacity",
"item": "muted"
},
"path": [
"number",
"opacity",
"muted"
]
}
},
"scale": {
"effect": {
"grow": {
"value": "1.05",
"filePath": "src/tokens/number/scale-effect.json",
"isSource": true,
"original": {
"value": "1.05"
},
"name": "number-scale-effect-grow",
"attributes": {
"category": "number",
"type": "scale",
"item": "effect",
"subitem": "grow"
},
"path": [
"number",
"scale",
"effect",
"grow"
]
},
"shrink": {
"value": "0.95",
"filePath": "src/tokens/number/scale-effect.json",
"isSource": true,
"original": {
"value": "0.95"
},
"name": "number-scale-effect-shrink",
"attributes": {
"category": "number",
"type": "scale",
"item": "effect",
"subitem": "shrink"
},
"path": [
"number",
"scale",
"effect",
"shrink"
]
}
},
"modular": {
"ratio": {
"value": "1.25",
"filePath": "src/tokens/number/scale-modular.js",
"isSource": true,
"original": {
"value": "1.25"
},
"name": "number-scale-modular-ratio",
"attributes": {
"category": "number",
"type": "scale",
"item": "modular",
"subitem": "ratio"
},
"path": [
"number",
"scale",
"modular",
"ratio"
]
},
"minimum_step": {
"value": "-6",
"filePath": "src/tokens/number/scale-modular.js",
"isSource": true,
"original": {
"value": "-6"
},
"name": "number-scale-modular-minimum-step",
"attributes": {
"category": "number",
"type": "scale",
"item": "modular",
"subitem": "minimum_step"
},
"path": [
"number",
"scale",
"modular",
"minimum_step"
]
},
"maximum_step": {
"value": "10",
"filePath": "src/tokens/number/scale-modular.js",
"isSource": true,
"original": {
"value": "10"
},
"name": "number-scale-modular-maximum-step",
"attributes": {
"category": "number",
"type": "scale",
"item": "modular",
"subitem": "maximum_step"
},
"path": [
"number",
"scale",
"modular",
"maximum_step"
]
}
}
},
"z_index": {
"alert": {
"value": 999,
"comment": "Intended to be used for alert messages that float above page content.",
"filePath": "src/tokens/number/z-index.json",
"isSource": true,
"original": {
"value": 999,
"comment": "Intended to be used for alert messages that float above page content."
},
"name": "number-z-index-alert",
"attributes": {
"category": "number",
"type": "z_index",
"item": "alert"
},
"path": [
"number",
"z_index",
"alert"
]
}
}
},
"size": {
"border": {
"radius": {
"small": {
"value": "0.125em",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "0.125em"
},
"name": "size-border-radius-small",
"attributes": {
"category": "size",
"type": "border",
"item": "radius",
"subitem": "small"
},
"path": [
"size",
"border",
"radius",
"small"
]
},
"medium": {
"value": "0.25em",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "0.25em"
},
"name": "size-border-radius-medium",
"attributes": {
"category": "size",
"type": "border",
"item": "radius",
"subitem": "medium"
},
"path": [
"size",
"border",
"radius",
"medium"
]
},
"large": {
"value": "0.5em",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "0.5em"
},
"name": "size-border-radius-large",
"attributes": {
"category": "size",
"type": "border",
"item": "radius",
"subitem": "large"
},
"path": [
"size",
"border",
"radius",
"large"
]
},
"card-contained": {
"value": "0.5em",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "{size.border.radius.large.value}"
},
"name": "size-border-radius-card-contained",
"attributes": {
"category": "size",
"type": "border",
"item": "radius",
"subitem": "card-contained"
},
"path": [
"size",
"border",
"radius",
"card-contained"
]
},
"full": {
"value": "9999px",
"comment": "A value of 50% would be more intuitive, but results in unexpectedly oblong rounding for non-square shapes. We use `px` to save the browser the trouble of recalculating the stupidly large value.",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "9999px",
"comment": "A value of 50% would be more intuitive, but results in unexpectedly oblong rounding for non-square shapes. We use `px` to save the browser the trouble of recalculating the stupidly large value."
},
"name": "size-border-radius-full",
"attributes": {
"category": "size",
"type": "border",
"item": "radius",
"subitem": "full"
},
"path": [
"size",
"border",
"radius",
"full"
]
}
},
"width": {
"blockquote": {
"value": "0.125rem",
"filePath": "src/tokens/size/border.json",
"isSource": true,
"original": {
"value": "{size.edge.medium.value}"
},
"name": "size-border-width-blockquote",
"attributes": {
"category": "size",
"type": "border",
"item": "width",
"subitem": "blockquote"
},
"path": [
"size",
"border",
"width",
"blockquote"
]
}
}
},
"breakpoint": {
"xs": {
"value": "20em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.xs.value}"
},
"name": "size-breakpoint-xs",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "xs"
},
"path": [
"size",
"breakpoint",
"xs"
]
},
"s": {
"value": "30em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.s.value}"
},
"name": "size-breakpoint-s",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "s"
},
"path": [
"size",
"breakpoint",
"s"
]
},
"m": {
"value": "40em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.m.value}"
},
"name": "size-breakpoint-m",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "m"
},
"path": [
"size",
"breakpoint",
"m"
]
},
"l": {
"value": "60em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.l.value}"
},
"name": "size-breakpoint-l",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "l"
},
"path": [
"size",
"breakpoint",
"l"
]
},
"xl": {
"value": "72em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.xl.value}"
},
"name": "size-breakpoint-xl",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "xl"
},
"path": [
"size",
"breakpoint",
"xl"
]
},
"xxl": {
"value": "84em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.xxl.value}"
},
"name": "size-breakpoint-xxl",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "xxl"
},
"path": [
"size",
"breakpoint",
"xxl"
]
},
"xxxl": {
"value": "96em",
"filePath": "src/tokens/size/breakpoint.json",
"isSource": true,
"original": {
"value": "{size.xxxl.value}"
},
"name": "size-breakpoint-xxxl",
"attributes": {
"category": "size",
"type": "breakpoint",
"item": "xxxl"
},
"path": [
"size",
"breakpoint",
"xxxl"
]
}
},
"edge": {
"small": {
"value": "0.0625rem",
"filePath": "src/tokens/size/edge.json",
"isSource": true,
"original": {
"value": "0.0625rem"
},
"name": "size-edge-small",
"attributes": {
"category": "size",
"type": "edge",
"item": "small"
},
"path": [
"size",
"edge",
"small"
]
},
"medium": {
"value": "0.125rem",
"filePath": "src/tokens/size/edge.json",
"isSource": true,
"original": {
"value": "0.125rem"
},
"name": "size-edge-medium",
"attributes": {
"category": "size",
"type": "edge",
"item": "medium"
},
"path": [
"size",
"edge",
"medium"
]
},
"large": {
"value": "0.25rem",
"filePath": "src/tokens/size/edge.json",
"isSource": true,
"original": {
"value": "0.25rem"
},
"name": "size-edge-large",
"attributes": {
"category": "size",
"type": "edge",
"item": "large"
},
"path": [
"size",
"edge",
"large"
]
},
"control": {
"value": "0.125rem",
"filePath": "src/tokens/size/edge.json",
"isSource": true,
"original": {
"value": "{size.edge.medium.value}"
},
"name": "size-edge-control",
"attributes": {
"category": "size",
"type": "edge",
"item": "control"
},
"path": [
"size",
"edge",
"control"
]
}
},
"font": {
"big": {
"value": "1.25em",
"comment": "Slightly larger than normal. Good for short introductory sections or important actions.",
"filePath": "src/tokens/size/font.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "Slightly larger than normal. Good for short introductory sections or important actions."
},
"name": "size-font-big",
"attributes": {
"category": "size",
"type": "font",
"item": "big"
},
"path": [
"size",
"font",
"big"
]
},
"small": {
"value": "0.8em",
"comment": "Slightly smaller than usual. Good for badges, captions or other space-constrained bits of copy.",
"filePath": "src/tokens/size/font.js",
"isSource": true,
"original": {
"value": "0.8em",
"comment": "Slightly smaller than usual. Good for badges, captions or other space-constrained bits of copy."
},
"name": "size-font-small",
"attributes": {
"category": "size",
"type": "font",
"item": "small"
},
"path": [
"size",
"font",
"small"
]
},
"heading_n2": {
"max": {
"value": "3.814697265625em",
"comment": "Maximum fluid size for heading level -2.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "3.814697265625em",
"comment": "Maximum fluid size for heading level -2."
},
"name": "size-font-heading-n2-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_n2",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_n2",
"max"
]
},
"min": {
"value": "3.0517578125em",
"comment": "Minimum fluid size for heading level -2.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "3.0517578125em",
"comment": "Minimum fluid size for heading level -2."
},
"name": "size-font-heading-n2-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_n2",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_n2",
"min"
]
}
},
"heading_n1": {
"max": {
"value": "3.0517578125em",
"comment": "Maximum fluid size for heading level -1.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "3.0517578125em",
"comment": "Maximum fluid size for heading level -1."
},
"name": "size-font-heading-n1-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_n1",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_n1",
"max"
]
},
"min": {
"value": "2.44140625em",
"comment": "Minimum fluid size for heading level -1.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "2.44140625em",
"comment": "Minimum fluid size for heading level -1."
},
"name": "size-font-heading-n1-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_n1",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_n1",
"min"
]
}
},
"heading_0": {
"max": {
"value": "2.44140625em",
"comment": "Maximum fluid size for heading level 0.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "2.44140625em",
"comment": "Maximum fluid size for heading level 0."
},
"name": "size-font-heading-0-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_0",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_0",
"max"
]
},
"min": {
"value": "1.953125em",
"comment": "Minimum fluid size for heading level 0.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.953125em",
"comment": "Minimum fluid size for heading level 0."
},
"name": "size-font-heading-0-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_0",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_0",
"min"
]
}
},
"heading_1": {
"max": {
"value": "1.953125em",
"comment": "Maximum fluid size for heading level 1.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.953125em",
"comment": "Maximum fluid size for heading level 1."
},
"name": "size-font-heading-1-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_1",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_1",
"max"
]
},
"min": {
"value": "1.5625em",
"comment": "Minimum fluid size for heading level 1.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.5625em",
"comment": "Minimum fluid size for heading level 1."
},
"name": "size-font-heading-1-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_1",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_1",
"min"
]
}
},
"heading_2": {
"max": {
"value": "1.5625em",
"comment": "Maximum fluid size for heading level 2.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.5625em",
"comment": "Maximum fluid size for heading level 2."
},
"name": "size-font-heading-2-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_2",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_2",
"max"
]
},
"min": {
"value": "1.25em",
"comment": "Minimum fluid size for heading level 2.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "Minimum fluid size for heading level 2."
},
"name": "size-font-heading-2-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_2",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_2",
"min"
]
}
},
"heading_3": {
"max": {
"value": "1.25em",
"comment": "Maximum fluid size for heading level 3.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "Maximum fluid size for heading level 3."
},
"name": "size-font-heading-3-max",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_3",
"subitem": "max"
},
"path": [
"size",
"font",
"heading_3",
"max"
]
},
"min": {
"value": "1em",
"comment": "Minimum fluid size for heading level 3.",
"filePath": "src/tokens/size/heading.js",
"isSource": true,
"original": {
"value": "1em",
"comment": "Minimum fluid size for heading level 3."
},
"name": "size-font-heading-3-min",
"attributes": {
"category": "size",
"type": "font",
"item": "heading_3",
"subitem": "min"
},
"path": [
"size",
"font",
"heading_3",
"min"
]
}
}
},
"max_width": {
"media_object": {
"value": "7em",
"filePath": "src/tokens/size/max-width.json",
"isSource": true,
"original": {
"value": "7em"
},
"name": "size-max-width-media-object",
"attributes": {
"category": "size",
"type": "max_width",
"item": "media_object"
},
"path": [
"size",
"max_width",
"media_object"
]
},
"prose": {
"value": "40em",
"filePath": "src/tokens/size/max-width.json",
"isSource": true,
"original": {
"value": "{size.m.value}"
},
"name": "size-max-width-prose",
"attributes": {
"category": "size",
"type": "max_width",
"item": "prose"
},
"path": [
"size",
"max_width",
"prose"
]
},
"spread": {
"value": "72em",
"filePath": "src/tokens/size/max-width.json",
"isSource": true,
"original": {
"value": "{size.xl.value}"
},
"name": "size-max-width-spread",
"attributes": {
"category": "size",
"type": "max_width",
"item": "spread"
},
"path": [
"size",
"max_width",
"spread"
]
}
},
"padding": {
"control": {
"horizontal": {
"value": "1.25em",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "1.25em"
},
"name": "size-padding-control-horizontal",
"attributes": {
"category": "size",
"type": "padding",
"item": "control",
"subitem": "horizontal"
},
"path": [
"size",
"padding",
"control",
"horizontal"
]
},
"vertical": {
"value": "0.40959999999999996em",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "0.40959999999999996em"
},
"name": "size-padding-control-vertical",
"attributes": {
"category": "size",
"type": "padding",
"item": "control",
"subitem": "vertical"
},
"path": [
"size",
"padding",
"control",
"vertical"
]
}
},
"cell": {
"horizontal": {
"value": "0.512em",
"comment": "Used for table cells or other repeating content rows.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "0.512em",
"comment": "Used for table cells or other repeating content rows."
},
"name": "size-padding-cell-horizontal",
"attributes": {
"category": "size",
"type": "padding",
"item": "cell",
"subitem": "horizontal"
},
"path": [
"size",
"padding",
"cell",
"horizontal"
]
},
"vertical": {
"value": "0.512em",
"comment": "Used for table cells or other repeating content rows.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "0.512em",
"comment": "Used for table cells or other repeating content rows."
},
"name": "size-padding-cell-vertical",
"attributes": {
"category": "size",
"type": "padding",
"item": "cell",
"subitem": "vertical"
},
"path": [
"size",
"padding",
"cell",
"vertical"
]
}
},
"container": {
"horizontal": {
"min": {
"value": "1.25rem",
"comment": "Minimum inline (horizontal) fluid padding for container objects.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "1.25rem",
"comment": "Minimum inline (horizontal) fluid padding for container objects."
},
"name": "size-padding-container-horizontal-min",
"attributes": {
"category": "size",
"type": "padding",
"item": "container",
"subitem": "horizontal",
"state": "min"
},
"path": [
"size",
"padding",
"container",
"horizontal",
"min"
]
},
"max": {
"value": "3.0517578125rem",
"comment": "Maximum inline (horizontal) padding for container objects.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "3.0517578125rem",
"comment": "Maximum inline (horizontal) padding for container objects."
},
"name": "size-padding-container-horizontal-max",
"attributes": {
"category": "size",
"type": "padding",
"item": "container",
"subitem": "horizontal",
"state": "max"
},
"path": [
"size",
"padding",
"container",
"horizontal",
"max"
]
}
},
"vertical": {
"min": {
"value": "1.953125rem",
"comment": "Minimum block (vertical) fluid padding for container objects.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "1.953125rem",
"comment": "Minimum block (vertical) fluid padding for container objects."
},
"name": "size-padding-container-vertical-min",
"attributes": {
"category": "size",
"type": "padding",
"item": "container",
"subitem": "vertical",
"state": "min"
},
"path": [
"size",
"padding",
"container",
"vertical",
"min"
]
},
"max": {
"value": "3.814697265625rem",
"comment": "Maximum block (vertical) padding for container objects.",
"filePath": "src/tokens/size/padding.js",
"isSource": true,
"original": {
"value": "3.814697265625rem",
"comment": "Maximum block (vertical) padding for container objects."
},
"name": "size-padding-container-vertical-max",
"attributes": {
"category": "size",
"type": "padding",
"item": "container",
"subitem": "vertical",
"state": "max"
},
"path": [
"size",
"padding",
"container",
"vertical",
"max"
]
}
}
}
},
"rhythm": {
"compact": {
"value": "0.262144em",
"filePath": "src/tokens/size/rhythm.js",
"isSource": true,
"original": {
"value": "0.262144em"
},
"name": "size-rhythm-compact",
"attributes": {
"category": "size",
"type": "rhythm",
"item": "compact"
},
"path": [
"size",
"rhythm",
"compact"
]
},
"condensed": {
"value": "0.8em",
"filePath": "src/tokens/size/rhythm.js",
"isSource": true,
"original": {
"value": "0.8em"
},
"name": "size-rhythm-condensed",
"attributes": {
"category": "size",
"type": "rhythm",
"item": "condensed"
},
"path": [
"size",
"rhythm",
"condensed"
]
},
"default": {
"value": "1.25em",
"filePath": "src/tokens/size/rhythm.js",
"isSource": true,
"original": {
"value": "1.25em"
},
"name": "size-rhythm-default",
"attributes": {
"category": "size",
"type": "rhythm",
"item": "default"
},
"path": [
"size",
"rhythm",
"default"
]
},
"default_rem": {
"value": "1.25rem",
"filePath": "src/tokens/size/rhythm.js",
"isSource": true,
"original": {
"value": "1.25rem"
},
"name": "size-rhythm-default-rem",
"attributes": {
"category": "size",
"type": "rhythm",
"item": "default_rem"
},
"path": [
"size",
"rhythm",
"default_rem"
]
},
"generous": {
"value": "1.953125em",
"filePath": "src/tokens/size/rhythm.js",
"isSource": true,
"original": {
"value": "1.953125em"
},
"name": "size-rhythm-generous",
"attributes": {
"category": "size",
"type": "rhythm",
"item": "generous"
},
"path": [
"size",
"rhythm",
"generous"
]
}
},
"xs": {
"value": "20em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "20em"
},
"name": "size-xs",
"attributes": {
"category": "size",
"type": "xs"
},
"path": [
"size",
"xs"
]
},
"s": {
"value": "30em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "30em"
},
"name": "size-s",
"attributes": {
"category": "size",
"type": "s"
},
"path": [
"size",
"s"
]
},
"m": {
"value": "40em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "40em"
},
"name": "size-m",
"attributes": {
"category": "size",
"type": "m"
},
"path": [
"size",
"m"
]
},
"l": {
"value": "60em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "60em"
},
"name": "size-l",
"attributes": {
"category": "size",
"type": "l"
},
"path": [
"size",
"l"
]
},
"xl": {
"value": "72em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "72em"
},
"name": "size-xl",
"attributes": {
"category": "size",
"type": "xl"
},
"path": [
"size",
"xl"
]
},
"xxl": {
"value": "84em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "84em"
},
"name": "size-xxl",
"attributes": {
"category": "size",
"type": "xxl"
},
"path": [
"size",
"xxl"
]
},
"xxxl": {
"value": "96em",
"filePath": "src/tokens/size/shirts.json",
"isSource": true,
"original": {
"value": "96em"
},
"name": "size-xxxl",
"attributes": {
"category": "size",
"type": "xxxl"
},
"path": [
"size",
"xxxl"
]
},
"height": {
"control": {
"default": {
"value": "2.44140625em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "2.44140625em"
},
"name": "size-height-control-default",
"attributes": {
"category": "size",
"type": "height",
"item": "control",
"subitem": "default"
},
"path": [
"size",
"height",
"control",
"default"
]
},
"multiline": {
"value": "3.814697265625em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "3.814697265625em"
},
"name": "size-height-control-multiline",
"attributes": {
"category": "size",
"type": "height",
"item": "control",
"subitem": "multiline"
},
"path": [
"size",
"height",
"control",
"multiline"
]
}
},
"logo": {
"default": {
"value": "1.953125em",
"comment": "Default height for the logo component, used to display client and project logos relative to case studies.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.953125em",
"comment": "Default height for the logo component, used to display client and project logos relative to case studies."
},
"name": "size-height-logo-default",
"attributes": {
"category": "size",
"type": "height",
"item": "logo",
"subitem": "default"
},
"path": [
"size",
"height",
"logo",
"default"
]
}
}
},
"icon": {
"default": {
"value": "1em",
"comment": "The default icon size.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1em",
"comment": "The default icon size."
},
"name": "size-icon-default",
"attributes": {
"category": "size",
"type": "icon",
"item": "default"
},
"path": [
"size",
"icon",
"default"
]
},
"medium": {
"value": "1.25em",
"comment": "The medium icon size.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "The medium icon size."
},
"name": "size-icon-medium",
"attributes": {
"category": "size",
"type": "icon",
"item": "medium"
},
"path": [
"size",
"icon",
"medium"
]
},
"large": {
"value": "1.5625em",
"comment": "The large icon size.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.5625em",
"comment": "The large icon size."
},
"name": "size-icon-large",
"attributes": {
"category": "size",
"type": "icon",
"item": "large"
},
"path": [
"size",
"icon",
"large"
]
},
"x-large": {
"value": "3.0517578125em",
"comment": "The x-large icon size.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "3.0517578125em",
"comment": "The x-large icon size."
},
"name": "size-icon-x-large",
"attributes": {
"category": "size",
"type": "icon",
"item": "x-large"
},
"path": [
"size",
"icon",
"x-large"
]
}
},
"width": {
"card_column": {
"min": {
"value": "16em",
"comment": "The minimum space to display a default card in a grid.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "16em",
"comment": "The minimum space to display a default card in a grid."
},
"name": "size-width-card-column-min",
"attributes": {
"category": "size",
"type": "width",
"item": "card_column",
"subitem": "min"
},
"path": [
"size",
"width",
"card_column",
"min"
]
}
},
"logo_group": {
"item_width": {
"value": "9em",
"comment": "The width of individual logos in the logo group.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "9em",
"comment": "The width of individual logos in the logo group."
},
"name": "size-width-logo-group-item-width",
"attributes": {
"category": "size",
"type": "width",
"item": "logo_group",
"subitem": "item_width"
},
"path": [
"size",
"width",
"logo_group",
"item_width"
]
}
}
},
"square": {
"avatar": {
"small": {
"value": "1.953125em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.953125em"
},
"name": "size-square-avatar-small",
"attributes": {
"category": "size",
"type": "square",
"item": "avatar",
"subitem": "small"
},
"path": [
"size",
"square",
"avatar",
"small"
]
},
"medium": {
"value": "3.0517578125em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "3.0517578125em"
},
"name": "size-square-avatar-medium",
"attributes": {
"category": "size",
"type": "square",
"item": "avatar",
"subitem": "medium"
},
"path": [
"size",
"square",
"avatar",
"medium"
]
},
"large": {
"value": "11.641532182693481em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "11.641532182693481em"
},
"name": "size-square-avatar-large",
"attributes": {
"category": "size",
"type": "square",
"item": "avatar",
"subitem": "large"
},
"path": [
"size",
"square",
"avatar",
"large"
]
},
"full": {
"value": "100%",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "100%"
},
"name": "size-square-avatar-full",
"attributes": {
"category": "size",
"type": "square",
"item": "avatar",
"subitem": "full"
},
"path": [
"size",
"square",
"avatar",
"full"
]
}
},
"control": {
"icon": {
"value": "1em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1em"
},
"name": "size-square-control-icon",
"attributes": {
"category": "size",
"type": "square",
"item": "control",
"subitem": "icon"
},
"path": [
"size",
"square",
"control",
"icon"
]
}
},
"toggle": {
"medium": {
"value": "1.5625em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.5625em"
},
"name": "size-square-toggle-medium",
"attributes": {
"category": "size",
"type": "square",
"item": "toggle",
"subitem": "medium"
},
"path": [
"size",
"square",
"toggle",
"medium"
]
}
},
"footnote_link": {
"value": "1.5625em",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.5625em"
},
"name": "size-square-footnote-link",
"attributes": {
"category": "size",
"type": "square",
"item": "footnote_link"
},
"path": [
"size",
"square",
"footnote_link"
]
}
},
"overlap": {
"small": {
"value": "0.262144em",
"comment": "Small amount of overlap between adjacent items organized in a visual bunch.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "0.262144em",
"comment": "Small amount of overlap between adjacent items organized in a visual bunch."
},
"name": "size-overlap-small",
"attributes": {
"category": "size",
"type": "overlap",
"item": "small"
},
"path": [
"size",
"overlap",
"small"
]
},
"large": {
"value": "1.25em",
"comment": "Larger amount of overlap between adjacent items.",
"filePath": "src/tokens/size/sizing.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "Larger amount of overlap between adjacent items."
},
"name": "size-overlap-large",
"attributes": {
"category": "size",
"type": "overlap",
"item": "large"
},
"path": [
"size",
"overlap",
"large"
]
}
},
"spacing": {
"gap": {
"button": {
"extra": {
"value": "0.40959999999999996em",
"comment": "Gap between button content and extra content.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "0.40959999999999996em",
"comment": "Gap between button content and extra content."
},
"name": "size-spacing-gap-button-extra",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "button",
"state": "extra"
},
"path": [
"size",
"spacing",
"gap",
"button",
"extra"
]
}
},
"inline": {
"small": {
"value": "1em",
"comment": "Horizontal/column gap between media object and content, etc.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "1em",
"comment": "Horizontal/column gap between media object and content, etc."
},
"name": "size-spacing-gap-inline-small",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "inline",
"state": "small"
},
"path": [
"size",
"spacing",
"gap",
"inline",
"small"
]
},
"medium": {
"value": "1.25em",
"comment": "Horizontal/column gap between cells in inline lists, event logs, etc.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "1.25em",
"comment": "Horizontal/column gap between cells in inline lists, event logs, etc."
},
"name": "size-spacing-gap-inline-medium",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "inline",
"state": "medium"
},
"path": [
"size",
"spacing",
"gap",
"inline",
"medium"
]
}
},
"fluid": {
"min": {
"value": "1.953125em",
"comment": "Minimum size of a large content gap, for example gutters between cards.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "1.953125em",
"comment": "Minimum size of a large content gap, for example gutters between cards."
},
"name": "size-spacing-gap-fluid-min",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "fluid",
"state": "min"
},
"path": [
"size",
"spacing",
"gap",
"fluid",
"min"
]
},
"max": {
"value": "3.814697265625em",
"comment": "Maximum size of a large content gap, for example gutters between cards.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "3.814697265625em",
"comment": "Maximum size of a large content gap, for example gutters between cards."
},
"name": "size-spacing-gap-fluid-max",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "fluid",
"state": "max"
},
"path": [
"size",
"spacing",
"gap",
"fluid",
"max"
]
}
},
"button_group": {
"default": {
"value": "0.64em",
"comment": "The Button Group default gap spacing.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "0.64em",
"comment": "The Button Group default gap spacing."
},
"name": "size-spacing-gap-button-group-default",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "button_group",
"state": "default"
},
"path": [
"size",
"spacing",
"gap",
"button_group",
"default"
]
}
},
"form_group": {
"default": {
"value": "0.32767999999999997em",
"comment": "The Form Group default gap spacing.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "0.32767999999999997em",
"comment": "The Form Group default gap spacing."
},
"name": "size-spacing-gap-form-group-default",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "form_group",
"state": "default"
},
"path": [
"size",
"spacing",
"gap",
"form_group",
"default"
]
}
},
"logo_group": {
"value": "1.953125em",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "1.953125em"
},
"name": "size-spacing-gap-logo-group",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "logo_group"
},
"path": [
"size",
"spacing",
"gap",
"logo_group"
]
},
"comment_form": {
"horizontal": {
"value": "2.44140625rem",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "2.44140625rem"
},
"name": "size-spacing-gap-comment-form-horizontal",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "comment_form",
"state": "horizontal"
},
"path": [
"size",
"spacing",
"gap",
"comment_form",
"horizontal"
]
},
"vertical": {
"value": "1.5625rem",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "1.5625rem"
},
"name": "size-spacing-gap-comment-form-vertical",
"attributes": {
"category": "size",
"type": "spacing",
"item": "gap",
"subitem": "comment_form",
"state": "vertical"
},
"path": [
"size",
"spacing",
"gap",
"comment_form",
"vertical"
]
}
}
},
"control": {
"text_inset": {
"value": "0.8em",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "0.8em"
},
"name": "size-spacing-control-text-inset",
"attributes": {
"category": "size",
"type": "spacing",
"item": "control",
"subitem": "text_inset"
},
"path": [
"size",
"spacing",
"control",
"text_inset"
]
},
"icon_inset": {
"value": "0.512em",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "0.512em"
},
"name": "size-spacing-control-icon-inset",
"attributes": {
"category": "size",
"type": "spacing",
"item": "control",
"subitem": "icon_inset"
},
"path": [
"size",
"spacing",
"control",
"icon_inset"
]
}
},
"type": {
"block_indent": {
"value": "1.25em",
"comment": "Shared indentation for lists, blockquotes, etc.",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "{size.spacing.gap.inline.medium.value}",
"comment": "Shared indentation for lists, blockquotes, etc."
},
"name": "size-spacing-type-block-indent",
"attributes": {
"category": "size",
"type": "spacing",
"item": "type",
"subitem": "block_indent"
},
"path": [
"size",
"spacing",
"type",
"block_indent"
]
}
},
"list": {
"inline_gap": {
"value": "1.25em",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "{size.spacing.gap.inline.medium.value}"
},
"name": "size-spacing-list-inline-gap",
"attributes": {
"category": "size",
"type": "spacing",
"item": "list",
"subitem": "inline_gap"
},
"path": [
"size",
"spacing",
"list",
"inline_gap"
]
}
},
"media": {
"gap": {
"value": "1em",
"filePath": "src/tokens/size/spacing.js",
"isSource": true,
"original": {
"value": "{size.spacing.gap.inline.small.value}"
},
"name": "size-spacing-media-gap",
"attributes": {
"category": "size",
"type": "spacing",
"item": "media",
"subitem": "gap"
},
"path": [
"size",
"spacing",
"media",
"gap"
]
}
}
}
},
"time": {
"transition": {
"instant": {
"value": "0s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0s"
},
"name": "time-transition-instant",
"attributes": {
"category": "time",
"type": "transition",
"item": "instant"
},
"path": [
"time",
"transition",
"instant"
]
},
"immediate": {
"value": "0.1s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0.1s"
},
"name": "time-transition-immediate",
"attributes": {
"category": "time",
"type": "transition",
"item": "immediate"
},
"path": [
"time",
"transition",
"immediate"
]
},
"quick": {
"value": "0.2s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0.2s"
},
"name": "time-transition-quick",
"attributes": {
"category": "time",
"type": "transition",
"item": "quick"
},
"path": [
"time",
"transition",
"quick"
]
},
"prompt": {
"value": "0.3s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0.3s"
},
"name": "time-transition-prompt",
"attributes": {
"category": "time",
"type": "transition",
"item": "prompt"
},
"path": [
"time",
"transition",
"prompt"
]
},
"slow": {
"value": "0.4s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0.4s"
},
"name": "time-transition-slow",
"attributes": {
"category": "time",
"type": "transition",
"item": "slow"
},
"path": [
"time",
"transition",
"slow"
]
},
"glacial": {
"value": "0.6s",
"filePath": "src/tokens/time/transition.json",
"isSource": true,
"original": {
"value": "0.6s"
},
"name": "time-transition-glacial",
"attributes": {
"category": "time",
"type": "transition",
"item": "glacial"
},
"path": [
"time",
"transition",
"glacial"
]
}
}
}
}