{ "light": { "color": { "text": { "default": { "type": "color", "value": "{color.neutral.950}", "description": "Gebruik voor primaire tekst zoals body copy, sentence case headers, en buttons in het light theme." }, "inverse": { "type": "color", "value": "{color.neutral.50}", "description": "Gebruik voor tekst op contrasterende achtergronden in het light theme." }, "disabled": { "type": "color", "value": "{color.neutral.alpha.500}", "description": "Gebruik voor tekst in een disabled state in het light theme." }, "selected": { "type": "color", "value": "{color.ugent-blue.500}", "description": "Gebruik voor tekst in selected of opened states zoals tabs en dropdown buttons in het light theme." }, "brand": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor tekst die de UGent merkidentiteit benadrukt in het light theme." }, "danger": { "type": "color", "value": "{color.tomato.600}", "description": "Gebruik voor tekst bij het signaleren van waarschuwingen of fouten, zoals input field errors in het light theme." }, "warning": { "type": "color", "value": "{color.ugent-yellow.600}", "description": "Gebruik voor waarschuwing- en notificatietekst in het light theme." }, "success": { "type": "color", "value": "{color.mint.600}", "description": "Gebruik voor succes- en bevestigingtekst in het light theme." }, "information": { "type": "color", "value": "{color.electric-blue.600}", "description": "Gebruik voor informatieve tekst of om aan te geven dat iets in uitvoering is in het light theme." }, "subtle": { "type": "color", "value": "{color.neutral.800}", "description": "Gebruik voor secundaire tekst zoals navigatie, button links, input field labels en all caps subheadings in het light theme." }, "subtlest": { "type": "color", "value": "{color.neutral.700}", "description": "Gebruik voor tertiaire tekst zoals meta-data, breadcrumbs, input field placeholder en helper text in het light theme." } }, "link": { "default": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor links in een default state in het light theme. Voeg een underline toe voor hovered states." }, "pressed": { "type": "color", "value": "{color.ugent-blue.700}", "description": "Gebruik voor links in een pressed state in het light theme." }, "visited": { "type": "color", "value": "{color.ugent-blue.500}", "description": "Gebruik voor links in een visited state in het light theme." } }, "border": { "default": { "type": "color", "value": "{color.neutral.alpha.300}", "description": "Gebruik voor UI-elementen visueel te groeperen of te scheiden in het light theme." }, "inverse": { "type": "color", "value": "{color.neutral.50}" }, "disabled": { "type": "color", "value": "{color.neutral.alpha.500}" }, "selected": { "type": "color", "value": "{color.ugent-blue.700}" }, "brand": { "type": "color", "value": "{color.ugent-blue.600}" }, "danger": { "type": "color", "value": "{color.tomato.600}" }, "warning": { "type": "color", "value": "{color.ugent-yellow.600}" }, "success": { "type": "color", "value": "{color.mint.600}" }, "information": { "type": "color", "value": "{color.electric-blue.600}" }, "input": { "type": "color", "value": "{color.neutral.500}" } }, "background": { "brand": { "default": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor achtergrond die de UGent merkidentiteit benadrukt in het light theme." }, "hovered": { "type": "color", "value": "{color.ugent-blue.500}" }, "pressed": { "type": "color", "value": "{color.ugent-blue.700}" } }, "danger": { "default": { "type": "color", "value": "{color.tomato.600}", "description": "Gebruik voor achtergronden die kritieke informatie communiceren, zoals in foutmeldingssecties in het light theme." }, "hovered": { "type": "color", "value": "{color.tomato.500}" }, "pressed": { "type": "color", "value": "{color.tomato.700}" } }, "warning": { "default": { "type": "color", "value": "{color.ugent-yellow.600}", "description": "Gebruik voor achtergronden die voorzichtigheid communiceren, zoals in waarschuwingssecties in het light theme." }, "hovered": { "type": "color", "value": "{color.ugent-yellow.500}" }, "pressed": { "type": "color", "value": "{color.ugent-yellow.700}" } }, "success": { "default": { "type": "color", "value": "{color.mint.600}", "description": "Gebruik voor succes- en bevestiging achtergrond in het light theme." }, "hovered": { "type": "color", "value": "{color.mint.500}" }, "pressed": { "type": "color", "value": "{color.mint.700}" } }, "information": { "default": { "type": "color", "value": "{color.electric-blue.600}", "description": "Gebruik voor informatieve achtergrond of om aan te geven dat iets in uitvoering is in het light theme." }, "hovered": { "type": "color", "value": "{color.electric-blue.500}" }, "pressed": { "type": "color", "value": "{color.electric-blue.700}" } }, "neutral": { "default": { "type": "color", "value": "{color.neutral.300}", "description": "Gebruik voor neutrale achtergrond wanneer er geen betekenis aan de kleur is verbonden." }, "hovered": { "type": "color", "value": "{color.neutral.400}" }, "pressed": { "type": "color", "value": "{color.neutral.500}" } }, "input": { "default": { "type": "color", "value": "{color.neutral.50}", "description": "Gebruik als achtergrond voor form UI-elementen zoals textfields, checkboxes, en radio buttons" }, "hovered": { "type": "color", "value": "{color.neutral.100}" }, "pressed": { "type": "color", "value": "{color.neutral.50}" } }, "disabled": { "type": "color", "value": "{color.neutral.alpha.100}", "description": "Gebruik als achtergrond voor UI-elementen in een disabled state" } } }, "elevation": { "surface": { "basic": { "default": { "type": "color", "value": "{color.neutral.0}", "description": "Gebruik als de primaire achtergrond voor de UI in het light theme." }, "hovered": { "type": "color", "value": "{color.neutral.50}", "description": "Gebruik als de primaire achtergrond in een hovered state in de UI in het light theme." }, "pressed": { "type": "color", "value": "{color.neutral.100}", "description": "Gebruik als de primaire achtergrond in een pressed state in de UI in het light theme." } }, "raised": { "default": { "type": "color", "value": "{color.neutral.100}" }, "hovered": { "type": "color", "value": "{color.neutral.200}" }, "pressed": { "type": "color", "value": "{color.neutral.300}" } }, "overlay": { "default": { "type": "color", "value": "{color.neutral.100}" }, "hovered": { "type": "color", "value": "{color.neutral.200}" }, "pressed": { "type": "color", "value": "{color.neutral.300}" } }, "sunken": { "default": { "type": "color", "value": "{color.neutral.50}" } } }, "shadow": { "overflow": { "type": "boxShadow", "value": "0px 0px 8px rgba(9, 30, 66, 0.16),0px 0px 1px rgba(9, 30, 66, 0.12)" }, "overlay": { "type": "boxShadow", "value": "0px 8px 12px rgba(9, 30, 66, 0.15),0px 0px 1px rgba(9, 30, 66, 0.31)" }, "raised": { "type": "boxShadow", "value": "0px 1px 1px rgba(9, 30, 66, 0.25),0px 0px 1px rgba(9, 30, 66, 0.31)" } } } }, "dark": { "color": { "text": { "default": { "type": "color", "value": "{color.neutral.dark.900}", "description": "Gebruik voor primaire tekst zoals body copy, sentence case headers, en buttons in het dark theme." }, "inverse": { "type": "color", "value": "{color.neutral.dark.100}", "description": "Gebruik voor tekst op contrasterende achtergronden in het dark theme." }, "disabled": { "type": "color", "value": "{color.neutral.dark.alpha.500}", "description": "Gebruik voor tekst in een disabled state in het dark theme." }, "selected": { "type": "color", "value": "{color.ugent-blue.700}", "description": "Gebruik voor tekst in selected of opened states zoals tabs en dropdown buttons in het dark theme." }, "brand": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor tekst die de UGent merkidentiteit benadrukt in het dark theme." }, "danger": { "type": "color", "value": "{color.tomato.600}", "description": "Gebruik voor tekst bij het signaleren van waarschuwingen of fouten, zoals input field errors in het dark theme." }, "warning": { "type": "color", "value": "{color.ugent-yellow.600}", "description": "Gebruik voor waarschuwing- en notificatietekst in het dark theme." }, "success": { "type": "color", "value": "{color.mint.600}", "description": "Gebruik voor succes- en bevestigingtekst in het dark theme." }, "information": { "type": "color", "value": "{color.electric-blue.600}", "description": "Gebruik voor informatieve tekst of om aan te geven dat iets in uitvoering is in het dark theme." }, "subtle": { "type": "color", "value": "{color.neutral.dark.800}", "description": "Gebruik voor secundaire tekst zoals navigatie, button links, input field labels en all caps subheadings in het dark theme." }, "subtlest": { "type": "color", "value": "{color.neutral.dark.700}", "description": "Gebruik voor tertiaire tekst zoals meta-data, breadcrumbs, input field placeholder en helper text in het dark theme." } }, "link": { "default": { "type": "color", "value": "{color.ugent-blue.500}", "description": "Gebruik voor links in een default state in het dark theme. Voeg een underline toe voor hovered states." }, "pressed": { "type": "color", "value": "{color.ugent-blue.400}", "description": "Gebruik voor links in een pressed state in het dark theme." }, "visited": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor links in een visited state in het dark theme." } }, "border": { "default": { "type": "color", "value": "{color.neutral.alpha.300}", "description": "Gebruik voor UI-elementen visueel te groeperen of te scheiden in het dark theme." }, "inverse": { "type": "color", "value": "{color.neutral.dark.50}" }, "disabled": { "type": "color", "value": "{color.neutral.dark.alpha.500}" }, "selected": { "type": "color", "value": "{color.ugent-blue.500}" }, "brand": { "type": "color", "value": "{color.ugent-blue.600}" }, "danger": { "type": "color", "value": "{color.tomato.600}" }, "warning": { "type": "color", "value": "{color.ugent-yellow.600}" }, "success": { "type": "color", "value": "{color.mint.600}" }, "information": { "type": "color", "value": "{color.electric-blue.600}" }, "input": { "type": "color", "value": "{color.neutral.dark.500}" } }, "background": { "brand": { "default": { "type": "color", "value": "{color.ugent-blue.600}", "description": "Gebruik voor achtergrond die de UGent merkidentiteit benadrukt in het dark theme." }, "hovered": { "type": "color", "value": "{color.ugent-blue.700}" }, "pressed": { "type": "color", "value": "{color.ugent-blue.500}" } }, "danger": { "default": { "type": "color", "value": "{color.tomato.600}", "description": "Gebruik voor achtergronden die kritieke informatie communiceren, zoals in foutmeldingssecties in het dark theme." }, "hovered": { "type": "color", "value": "{color.tomato.700}" }, "pressed": { "type": "color", "value": "{color.tomato.500}" } }, "warning": { "default": { "type": "color", "value": "{color.ugent-yellow.600}", "description": "Gebruik voor achtergronden die voorzichtigheid communiceren, zoals in waarschuwingssecties in het dark theme." }, "hovered": { "type": "color", "value": "{color.ugent-yellow.700}" }, "pressed": { "type": "color", "value": "{color.ugent-yellow.500}" } }, "success": { "default": { "type": "color", "value": "{color.mint.600}", "description": "Gebruik voor succes- en bevestiging achtergrond in het dark theme." }, "hovered": { "type": "color", "value": "{color.mint.700}" }, "pressed": { "type": "color", "value": "{color.mint.500}" } }, "information": { "default": { "type": "color", "value": "{color.electric-blue.600}", "description": "Gebruik voor informatieve achtergrond of om aan te geven dat iets in uitvoering is in het light theme." }, "hovered": { "type": "color", "value": "{color.electric-blue.700}" }, "pressed": { "type": "color", "value": "{color.electric-blue.500}" } }, "neutral": { "default": { "type": "color", "value": "{color.neutral.dark.300}", "description": "Gebruik voor neutrale achtergrond wanneer er geen betekenis aan de kleur is verbonden." }, "hovered": { "type": "color", "value": "{color.neutral.dark.400}" }, "pressed": { "type": "color", "value": "{color.neutral.dark.500}" } }, "input": { "default": { "type": "color", "value": "{color.neutral.dark.50}", "description": "Gebruik als achtergrond voor form UI-elementen zoals textfields, checkboxes, en radio buttons." }, "hovered": { "type": "color", "value": "{color.neutral.dark.100}" }, "pressed": { "type": "color", "value": "{color.neutral.dark.50}" } }, "disabled": { "type": "color", "value": "{color.neutral.dark.alpha.100}", "description": "Gebruik als achtergrond voor UI-elementen in een disabled state" } } }, "elevation": { "surface": { "basic": { "default": { "type": "color", "value": "{color.neutral.dark.50}", "description": "Gebruik als de primaire achtergrond voor de UI in het dark theme." }, "hovered": { "type": "color", "value": "{color.neutral.dark.100}", "description": "Gebruik als de primaire achtergrond in een hovered state in de UI in het dark theme." }, "pressed": { "type": "color", "value": "{color.neutral.dark.200}", "description": "Gebruik als de primaire achtergrond in een pressed state in de UI in het dark theme." } }, "raised": { "default": { "type": "color", "value": "{color.neutral.dark.100}" }, "hovered": { "type": "color", "value": "{color.neutral.dark.200}" }, "pressed": { "type": "color", "value": "{color.neutral.dark.300}" } }, "overlay": { "default": { "type": "color", "value": "{color.neutral.dark.100}" }, "hovered": { "type": "color", "value": "{color.neutral.dark.200}" }, "pressed": { "type": "color", "value": "{color.neutral.dark.300}" } }, "sunken": { "default": { "type": "color", "value": "{color.neutral.dark.50}" } } }, "shadow": { "overflow": { "type": "boxShadow", "value": "0px 0px 12px rgba(3, 4, 4, 0.56),0px 0px 1px rgba(3, 4, 4, 0.5)" }, "overlay": { "type": "boxShadow", "value": "0px 0px 0px rgba(57, 66, 74, 1),0px 8px 12px rgba(3, 4, 4, 0.36),0px 0px 1px rgba(3, 4, 4, 0.5)" }, "raised": { "type": "boxShadow", "value": "0px 0px 0px rgba(0, 0, 0, 0),0px 1px 1px rgba(3, 4, 4, 0.5),0px 0px 1px rgba(3, 4, 4, 0.5)" } } } }, "core": { "color": { "ugent-blue": { "50": { "type": "color", "value": "#E9F1FC" }, "100": { "type": "color", "value": "#C8DCF5" }, "200": { "type": "color", "value": "#A6C4EC" }, "300": { "type": "color", "value": "#84ACE3" }, "400": { "type": "color", "value": "#6294DA" }, "500": { "type": "color", "value": "#407CD1" }, "600": { "type": "color", "value": "#1E64C8" }, "700": { "type": "color", "value": "#1753A6" }, "800": { "type": "color", "value": "#124182" }, "900": { "type": "color", "value": "#0D2F5E" }, "950": { "type": "color", "value": "#081D3A" } }, "ugent-yellow": { "50": { "type": "color", "value": "#FFFAE5" }, "100": { "type": "color", "value": "#FFF5BE" }, "200": { "type": "color", "value": "#FFEE98" }, "300": { "type": "color", "value": "#FFE772" }, "400": { "type": "color", "value": "#FFE04C" }, "500": { "type": "color", "value": "#FFD926" }, "600": { "type": "color", "value": "#FFD200" }, "700": { "type": "color", "value": "#D2AD00" }, "800": { "type": "color", "value": "#A48700" }, "900": { "type": "color", "value": "#766100" }, "950": { "type": "color", "value": "#483B00" } }, "mint": { "50": { "type": "color", "value": "#E5FFF9" }, "100": { "type": "color", "value": "#BEF6EA" }, "200": { "type": "color", "value": "#98ECDA" }, "300": { "type": "color", "value": "#72E2CA" }, "400": { "type": "color", "value": "#4CD8BA" }, "500": { "type": "color", "value": "#26CEAA" }, "600": { "type": "color", "value": "#00C49A" }, "700": { "type": "color", "value": "#00A280" }, "800": { "type": "color", "value": "#008065" }, "900": { "type": "color", "value": "#005E4A" }, "950": { "type": "color", "value": "#003C2F" } }, "tomato": { "50": { "type": "color", "value": "#FFE7E6" }, "100": { "type": "color", "value": "#FFCFCC" }, "200": { "type": "color", "value": "#FFBAB6" }, "300": { "type": "color", "value": "#FF9D97" }, "400": { "type": "color", "value": "#FE847D" }, "500": { "type": "color", "value": "#FD6B63" }, "600": { "type": "color", "value": "#FC5249" }, "700": { "type": "color", "value": "#CD423C" }, "800": { "type": "color", "value": "#A0322D" }, "900": { "type": "color", "value": "#73221E" }, "950": { "type": "color", "value": "#46120F" } }, "electric-blue": { "50": { "type": "color", "value": "#E5FDFF" }, "100": { "type": "color", "value": "#BAF9FF" }, "200": { "type": "color", "value": "#9CF7FF" }, "300": { "type": "color", "value": "#72F4FF" }, "400": { "type": "color", "value": "#4CF0FE" }, "500": { "type": "color", "value": "#26ECFD" }, "600": { "type": "color", "value": "#00E8FC" }, "700": { "type": "color", "value": "#00BFCE" }, "800": { "type": "color", "value": "#0095A1" }, "900": { "type": "color", "value": "#006B74" }, "950": { "type": "color", "value": "#004147" } }, "neutral": { "0": { "type": "color", "value": "#FFFFFF" }, "50": { "type": "color", "value": "#F1F2F4" }, "100": { "type": "color", "value": "#DFE0E8" }, "200": { "type": "color", "value": "#CDD0DA" }, "300": { "type": "color", "value": "#BBC0CC" }, "400": { "type": "color", "value": "#A9B0BE" }, "500": { "type": "color", "value": "#97A0B0" }, "600": { "type": "color", "value": "#8590A2" }, "700": { "type": "color", "value": "#6B7486" }, "800": { "type": "color", "value": "#535A68" }, "900": { "type": "color", "value": "#3B404A" }, "950": { "type": "color", "value": "#0B0C0E" }, "alpha": { "100": { "type": "color", "value": "#8590A210" }, "300": { "type": "color", "value": "#8590A230" }, "500": { "type": "color", "value": "#8590A250" }, "700": { "type": "color", "value": "#8590A270" }, "900": { "type": "color", "value": "#8590A290" } }, "dark": { "50": { "type": "color", "value": "#1B1F22" }, "100": { "type": "color", "value": "#2B3136" }, "200": { "type": "color", "value": "#3B434A" }, "300": { "type": "color", "value": "#4B555E" }, "400": { "type": "color", "value": "#596773" }, "500": { "type": "color", "value": "#727E89" }, "600": { "type": "color", "value": "#8B959F" }, "700": { "type": "color", "value": "#A4ACB5" }, "800": { "type": "color", "value": "#BDC3CB" }, "900": { "type": "color", "value": "#D6DAE1" }, "950": { "type": "color", "value": "#F1F2F4" }, "alpha": { "100": { "type": "color", "value": "#8B959F80" }, "300": { "type": "color", "value": "#8B959F70" }, "500": { "type": "color", "value": "#8B959F50" }, "700": { "type": "color", "value": "#8B959F30" }, "900": { "type": "color", "value": "#8B959F20" } } } } }, "space": { "0": { "type": "dimension", "value": "0px" }, "100": { "type": "dimension", "value": "8px" }, "150": { "type": "dimension", "value": "12px" }, "200": { "type": "dimension", "value": "16px" }, "250": { "type": "dimension", "value": "20px" }, "300": { "type": "dimension", "value": "24px" }, "400": { "type": "dimension", "value": "32px" }, "500": { "type": "dimension", "value": "40px" }, "600": { "type": "dimension", "value": "48px" }, "800": { "type": "dimension", "value": "64px" }, "1000": { "type": "dimension", "value": "80px" }, "025": { "type": "dimension", "value": "2px" }, "050": { "type": "dimension", "value": "4px" }, "075": { "type": "dimension", "value": "6px" }, "negative": { "100": { "type": "dimension", "value": "-8px" }, "150": { "type": "dimension", "value": "-12px" }, "200": { "type": "dimension", "value": "-16px" }, "250": { "type": "dimension", "value": "-20px" }, "300": { "type": "dimension", "value": "-24px" }, "400": { "type": "dimension", "value": "-32px" }, "025": { "type": "dimension", "value": "-2px" }, "050": { "type": "dimension", "value": "-4px" }, "075": { "type": "dimension", "value": "-6px" } } }, "border": { "width": { "small": { "type": "borderWidth", "value": "1px" }, "medium": { "type": "borderWidth", "value": "2px" }, "large": { "type": "borderWidth", "value": "4px" } }, "radius": { "small": { "type": "borderRadius", "value": "3px" }, "medium": { "type": "borderRadius", "value": "5px" }, "large": { "type": "borderRadius", "value": "7px" }, "extra-large": { "type": "borderRadius", "value": "14px" } } }, "font": { "family": { "sans-serif": { "type": "fontFamilies", "value": "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif" }, "monospaced": { "type": "fontFamilies", "value": "'SFMono-Medium', 'SF Mono', 'Segoe UI Mono', 'Roboto Mono', 'Ubuntu Mono', Menlo, Consolas, Courier, monospace" } }, "weight": { "light": { "type": "fontWeights", "value": "300" }, "normal": { "type": "fontWeights", "value": "400" }, "medium": { "type": "fontWeights", "value": "500" }, "semibold": { "type": "fontWeights", "value": "600" }, "bold": { "type": "fontWeights", "value": "700" } }, "body": { "small": { "type": "fontSizes", "value": "11px" }, "base": { "type": "fontSizes", "value": "14px" }, "large": { "type": "fontSizes", "value": "16px" } }, "heading": { "xxxsmall": { "type": "fontSizes", "value": "11px" }, "xxsmall": { "type": "fontSizes", "value": "12px" }, "xsmall": { "type": "fontSizes", "value": "14px" }, "small": { "type": "fontSizes", "value": "16px" }, "medium": { "type": "fontSizes", "value": "20px" }, "large": { "type": "fontSizes", "value": "24px" }, "xlarge": { "type": "fontSizes", "value": "29px" }, "xxlarge": { "type": "fontSizes", "value": "35px" } }, "lineheight": { "xsmall": { "type": "lineHeights", "value": "16px" }, "small": { "type": "lineHeights", "value": "20px" }, "medium": { "type": "lineHeights", "value": "24px" }, "large": { "type": "lineHeights", "value": "28px" }, "xlarge": { "type": "lineHeights", "value": "32px" }, "xxlarge": { "type": "lineHeights", "value": "40px" } }, "letterspacing": { "normal": { "type": "dimension", "value": "0" }, "tight": { "type": "dimension", "value": "-0.25px" }, "tighter": { "type": "dimension", "value": "-0.5px" } } } }, "typography": { "font-family-sans": { "value": "SF Pro Text, Segoe UI, Inter", "type": "fontFamilies" }, "headings": { "h900": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.medium}", "fontSize": "{font.heading.xxlarge}", "lineHeight": "{font.lineheight.xxlarge}", "letterSpacing": "{font.letterspacing.tighter}" }, "type": "typography", "description": "h900 style" }, "h800": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.semibold}", "fontSize": "{font.heading.xlarge}", "lineHeight": "{font.lineheight.xlarge}", "letterSpacing": "{font.letterspacing.tighter}" }, "type": "typography", "description": "h800 style" }, "h700": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.medium}", "fontSize": "{font.heading.large}", "lineHeight": "{font.lineheight.large}", "letterSpacing": "{font.letterspacing.tighter}" }, "type": "typography", "description": "h700 style" }, "h600": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.medium}", "fontSize": "{font.heading.medium}", "lineHeight": "{font.lineheight.medium}", "letterSpacing": "{font.letterspacing.tighter}" }, "type": "typography", "description": "h600 style" }, "h500": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.semibold}", "fontSize": "{font.heading.small}", "lineHeight": "{font.lineheight.small}", "letterSpacing": "{font.letterspacing.tight}" }, "type": "typography", "description": "h500 style" }, "h400": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.semibold}", "fontSize": "{font.heading.xsmall}", "lineHeight": "{font.lineheight.xsmall}", "letterSpacing": "{font.letterspacing.tight}" }, "type": "typography", "description": "h400 style" }, "h300": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.semibold}", "fontSize": "{font.heading.xxsmall}", "lineHeight": "{font.lineheight.xsmall}", "letterSpacing": "{font.letterspacing.normal}" }, "type": "typography", "description": "h300 style" }, "h200": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.semibold}", "fontSize": "{font.heading.xxsmall}", "lineHeight": "{font.lineheight.xsmall}", "letterSpacing": "{font.letterspacing.normal}" }, "type": "typography", "description": "h200 style" }, "h100": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.bold}", "fontSize": "{font.heading.xxxsmall}", "lineHeight": "{font.lineheight.xsmall}", "letterSpacing": "{font.letterspacing.normal}" }, "type": "typography", "description": "h100 style" } }, "text": { "regular": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.normal}", "fontSize": "{font.body.base}", "lineHeight": "{font.lineheight.small}", "letterSpacing": "{font.letterspacing.normal}" }, "type": "typography", "description": "Regular text style" }, "regular-underline": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.normal}", "fontSize": "{font.body.base}", "lineHeight": "{font.lineheight.small}", "letterSpacing": "{font.letterspacing.normal}", "textDecoration": "underline" }, "type": "typography", "description": "Regular underline text style" }, "Bold": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.bold}", "fontSize": "{font.body.base}", "lineHeight": "{font.lineheight.small}", "letterSpacing": "{font.letterspacing.normal}" }, "type": "typography", "description": "Regular underline text style" }, "Bold underline": { "value": { "fontFamily": "{font-family-sans}", "fontWeight": "{font.weight.bold}", "fontSize": "{font.body.base}", "lineHeight": "{font.lineheight.small}", "letterSpacing": "{font.letterspacing.normal}", "textDecoration": "underline" }, "type": "typography", "description": "Regular underline text style" } } }, "$themes": [ { "id": "b2e2be6ff5c7761939b69817eabbbe2f88f5ab91", "name": "core", "selectedTokenSets": { "core": "enabled" }, "$figmaStyleReferences": {}, "$figmaVariableReferences": {}, "$figmaCollectionId": "VariableCollectionId:10:349", "$figmaModeId": "10:9" }, { "id": "6a148de1a5f4c2ef8bfd53876881c3cb5e3b2baa", "name": "light", "selectedTokenSets": { "core": "source", "light": "enabled" }, "$figmaStyleReferences": {}, "$figmaVariableReferences": {}, "$figmaCollectionId": "VariableCollectionId:10:456", "$figmaModeId": "10:10" }, { "id": "523c952e5224ccc914212943c7ae93e11298ef35", "name": "dark", "selectedTokenSets": { "core": "source", "dark": "enabled" }, "$figmaStyleReferences": {}, "$figmaVariableReferences": {}, "$figmaCollectionId": "VariableCollectionId:10:467", "$figmaModeId": "10:11" } ], "$metadata": { "tokenSetOrder": [ "core", "light", "dark" ] } }