{ "core": { "dimension": { "scale": { "$value": "2", "$type": "dimension" }, "xs": { "$value": "4", "$type": "dimension" }, "sm": { "$value": "{dimension.xs} * {dimension.scale}", "$type": "dimension" }, "md": { "$value": "{dimension.sm} * {dimension.scale}", "$type": "dimension" }, "lg": { "$value": "{dimension.md} * {dimension.scale}", "$type": "dimension" }, "xl": { "$value": "{dimension.lg} * {dimension.scale}", "$type": "dimension" } }, "spacing": { "xs": { "$value": "{dimension.xs}", "$type": "spacing" }, "sm": { "$value": "{dimension.sm}", "$type": "spacing" }, "md": { "$value": "{dimension.md}", "$type": "spacing" }, "lg": { "$value": "{dimension.lg}", "$type": "spacing" }, "xl": { "$value": "{dimension.xl}", "$type": "spacing" }, "multi-value": { "$value": "{dimension.sm} {dimension.xl}", "$type": "spacing", "$description": "You can have multiple values in a single spacing token. Read more on these: https://docs.tokens.studio/available-tokens/spacing-tokens#multi-value-spacing-tokens" } }, "borderRadius": { "sm": { "$value": "4", "$type": "borderRadius" }, "lg": { "$value": "8", "$type": "borderRadius" }, "xl": { "$value": "16", "$type": "borderRadius" }, "multi-value": { "$value": "{borderRadius.sm} {borderRadius.lg}", "$type": "borderRadius", "$description": "You can have multiple values in a single radius token. Read more on these: https://docs.tokens.studio/available-tokens/border-radius-tokens#single--multiple-values" } }, "colors": { "black": { "$value": "#000000", "$type": "color" }, "white": { "$value": "#ffffff", "$type": "color" }, "gray": { "100": { "$value": "#f7fafc", "$type": "color" }, "200": { "$value": "#edf2f7", "$type": "color" }, "300": { "$value": "#e2e8f0", "$type": "color" }, "400": { "$value": "#cbd5e0", "$type": "color" }, "500": { "$value": "#a0aec0", "$type": "color" }, "600": { "$value": "#718096", "$type": "color" }, "700": { "$value": "#4a5568", "$type": "color" }, "800": { "$value": "#2d3748", "$type": "color" }, "900": { "$value": "#1a202c", "$type": "color" } }, "red": { "100": { "$value": "#fff5f5", "$type": "color" }, "200": { "$value": "#fed7d7", "$type": "color" }, "300": { "$value": "#feb2b2", "$type": "color" }, "400": { "$value": "#fc8181", "$type": "color" }, "500": { "$value": "#f56565", "$type": "color" }, "600": { "$value": "#e53e3e", "$type": "color" }, "700": { "$value": "#c53030", "$type": "color" }, "800": { "$value": "#9b2c2c", "$type": "color" }, "900": { "$value": "#742a2a", "$type": "color" } }, "orange": { "100": { "$value": "#fffaf0", "$type": "color" }, "200": { "$value": "#feebc8", "$type": "color" }, "300": { "$value": "#fbd38d", "$type": "color" }, "400": { "$value": "#f6ad55", "$type": "color" }, "500": { "$value": "#ed8936", "$type": "color" }, "600": { "$value": "#dd6b20", "$type": "color" }, "700": { "$value": "#c05621", "$type": "color" }, "800": { "$value": "#9c4221", "$type": "color" }, "900": { "$value": "#7b341e", "$type": "color" } }, "yellow": { "100": { "$value": "#fffff0", "$type": "color" }, "200": { "$value": "#fefcbf", "$type": "color" }, "300": { "$value": "#faf089", "$type": "color" }, "400": { "$value": "#f6e05e", "$type": "color" }, "500": { "$value": "#ecc94b", "$type": "color" }, "600": { "$value": "#d69e2e", "$type": "color" }, "700": { "$value": "#b7791f", "$type": "color" }, "800": { "$value": "#975a16", "$type": "color" }, "900": { "$value": "#744210", "$type": "color" } }, "green": { "100": { "$value": "#f0fff4", "$type": "color" }, "200": { "$value": "#c6f6d5", "$type": "color" }, "300": { "$value": "#9ae6b4", "$type": "color" }, "400": { "$value": "#68d391", "$type": "color" }, "500": { "$value": "#48bb78", "$type": "color" }, "600": { "$value": "#38a169", "$type": "color" }, "700": { "$value": "#2f855a", "$type": "color" }, "800": { "$value": "#276749", "$type": "color" }, "900": { "$value": "#22543d", "$type": "color" } }, "teal": { "100": { "$value": "#e6fffa", "$type": "color" }, "200": { "$value": "#b2f5ea", "$type": "color" }, "300": { "$value": "#81e6d9", "$type": "color" }, "400": { "$value": "#4fd1c5", "$type": "color" }, "500": { "$value": "#38b2ac", "$type": "color" }, "600": { "$value": "#319795", "$type": "color" }, "700": { "$value": "#2c7a7b", "$type": "color" }, "800": { "$value": "#285e61", "$type": "color" }, "900": { "$value": "#234e52", "$type": "color" } }, "blue": { "100": { "$value": "#ebf8ff", "$type": "color" }, "200": { "$value": "#bee3f8", "$type": "color" }, "300": { "$value": "#90cdf4", "$type": "color" }, "400": { "$value": "#63b3ed", "$type": "color" }, "500": { "$value": "#4299e1", "$type": "color" }, "600": { "$value": "#3182ce", "$type": "color" }, "700": { "$value": "#2b6cb0", "$type": "color" }, "800": { "$value": "#2c5282", "$type": "color" }, "900": { "$value": "#2a4365", "$type": "color" } }, "indigo": { "100": { "$value": "#ebf4ff", "$type": "color" }, "200": { "$value": "#c3dafe", "$type": "color" }, "300": { "$value": "#a3bffa", "$type": "color" }, "400": { "$value": "#7f9cf5", "$type": "color" }, "500": { "$value": "#667eea", "$type": "color" }, "600": { "$value": "#5a67d8", "$type": "color" }, "700": { "$value": "#4c51bf", "$type": "color" }, "800": { "$value": "#434190", "$type": "color" }, "900": { "$value": "#3c366b", "$type": "color" } }, "purple": { "100": { "$value": "#faf5ff", "$type": "color" }, "200": { "$value": "#e9d8fd", "$type": "color" }, "300": { "$value": "#d6bcfa", "$type": "color" }, "400": { "$value": "#b794f4", "$type": "color" }, "500": { "$value": "#9f7aea", "$type": "color" }, "600": { "$value": "#805ad5", "$type": "color" }, "700": { "$value": "#6b46c1", "$type": "color" }, "800": { "$value": "#553c9a", "$type": "color" }, "900": { "$value": "#44337a", "$type": "color" } }, "pink": { "100": { "$value": "#fff5f7", "$type": "color" }, "200": { "$value": "#fed7e2", "$type": "color" }, "300": { "$value": "#fbb6ce", "$type": "color" }, "400": { "$value": "#f687b3", "$type": "color" }, "500": { "$value": "#ed64a6", "$type": "color" }, "600": { "$value": "#d53f8c", "$type": "color" }, "700": { "$value": "#b83280", "$type": "color" }, "800": { "$value": "#97266d", "$type": "color" }, "900": { "$value": "#702459", "$type": "color" } } }, "opacity": { "low": { "$value": "10%", "$type": "opacity" }, "md": { "$value": "50%", "$type": "opacity" }, "high": { "$value": "90%", "$type": "opacity" } }, "fontFamilies": { "heading": { "$value": "Inter", "$type": "fontFamilies" }, "body": { "$value": "Roboto", "$type": "fontFamilies" }, "pretendard": { "$value": "Pretendard", "$type": "fontFamilies" } }, "lineHeights": { "0": { "$value": 20, "$type": "lineHeights" }, "1": { "$value": 20, "$type": "lineHeights" }, "2": { "$value": 20, "$type": "lineHeights" }, "3": { "$value": 20, "$type": "lineHeights" }, "4": { "$value": 20, "$type": "lineHeights" }, "5": { "$value": 20, "$type": "lineHeights" }, "6": { "$value": 20, "$type": "lineHeights" }, "heading": { "$value": "110%", "$type": "lineHeights" }, "body": { "$value": "140%", "$type": "lineHeights" } }, "letterSpacing": { "0": { "$value": "-2%", "$type": "letterSpacing" }, "default": { "$value": "0", "$type": "letterSpacing" }, "increased": { "$value": "150%", "$type": "letterSpacing" }, "decreased": { "$value": "-5%", "$type": "letterSpacing" } }, "paragraphSpacing": { "0": { "$value": 0, "$type": "paragraphSpacing" }, "h1": { "$value": "32", "$type": "paragraphSpacing" }, "h2": { "$value": "26", "$type": "paragraphSpacing" } }, "fontWeights": { "headingRegular": { "$value": "Regular", "$type": "fontWeights" }, "headingBold": { "$value": "Bold", "$type": "fontWeights" }, "bodyRegular": { "$value": "Regular", "$type": "fontWeights" }, "bodyBold": { "$value": "Bold", "$type": "fontWeights" }, "pretendard-0": { "$value": "ExtraBold", "$type": "fontWeights" }, "pretendard-1": { "$value": "SemiBold", "$type": "fontWeights" }, "pretendard-2": { "$value": "Regular", "$type": "fontWeights" } }, "fontSizes": { "h1": { "$value": "roundTo({fontSizes.body}*1.25^5)", "$type": "fontSizes" }, "h2": { "$value": "roundTo({fontSizes.body}*1.25^4)", "$type": "fontSizes" }, "h3": { "$value": "roundTo({fontSizes.body}*1.25^3)", "$type": "fontSizes" }, "h4": { "$value": "roundTo({fontSizes.body}*1.25^2)", "$type": "fontSizes" }, "h5": { "$value": "roundTo({fontSizes.body}*1.25^1)", "$type": "fontSizes" }, "h6": { "$value": "{fontSizes.body}", "$type": "fontSizes" }, "body": { "$value": "16", "$type": "fontSizes" }, "sm": { "$value": "{fontSizes.body} * 0.85", "$type": "fontSizes" }, "xs": { "$value": "{fontSizes.body} * 0.65", "$type": "fontSizes" } }, "ai_color": { "$value": "linear-gradient(180deg, #da8cf1 0%, #8bb1f2 100%)", "$type": "color" }, "primary-lv-0": { "$value": "#e9eeed", "$type": "color" }, "primary-lv-1": { "$value": "#d2dcdb", "$type": "color" }, "primary-lv-2": { "$value": "#a5b9b6", "$type": "color" }, "primary-lv-3": { "$value": "#789792", "$type": "color" }, "primary-lv-4": { "$value": "#4b746d", "$type": "color" }, "primary-lv-5": { "$value": "#35635c", "$type": "color" }, "primary-lv-6": { "$value": "#1e5149", "$type": "color" }, "primary-lv-7": { "$value": "#1b443d", "$type": "color" }, "primary-lv-8": { "$value": "#193833", "$type": "color" }, "primary-lv-9": { "$value": "#162a27", "$type": "color" }, "color-red": { "$value": "#f21d0d", "$type": "color" }, "color-pink": { "$value": "#e8175e", "$type": "color" }, "color-magenta": { "$value": "#b92ed1", "$type": "color" }, "color-purple": { "$value": "#6d3dc2", "$type": "color" }, "color-navy": { "$value": "#4255bd", "$type": "color" }, "color-blue": { "$value": "#0d8df2", "$type": "color" }, "color-cyan": { "$value": "#03aefc", "$type": "color" }, "color-green": { "$value": "#4db251", "$type": "color" }, "color-yellow": { "$value": "#ffbf00", "$type": "color" }, "color-orange": { "$value": "#ff9800", "$type": "color" }, "color-dahong": { "$value": "#ff3d00", "$type": "color" }, "color-brown": { "$value": "#a0705f", "$type": "color" }, "color-iron": { "$value": "#7f7f7f", "$type": "color" }, "color-steel": { "$value": "#688897", "$type": "color" }, "color-red-light": { "$value": "#fee9e7", "$type": "color" }, "color-pink-light": { "$value": "#fde8ef", "$type": "color" }, "color-magenta-light": { "$value": "#f8ebfb", "$type": "color" }, "color-purple-light": { "$value": "#f1ecf9", "$type": "color" }, "color-navy-light": { "$value": "#edeef9", "$type": "color" }, "color-blue-light": { "$value": "#e7f4fe", "$type": "color" }, "color-cyan-light": { "$value": "#e6f7ff", "$type": "color" }, "color-green-light": { "$value": "#eef8ee", "$type": "color" }, "color-yellow-light": { "$value": "#fff9e6", "$type": "color" }, "color-orange-light": { "$value": "#fff5e6", "$type": "color" }, "color-dahong-light": { "$value": "#ffece6", "$type": "color" }, "color-brown-light": { "$value": "#f6f1ef", "$type": "color" }, "color-iron-light": { "$value": "#f3f3f3", "$type": "color" }, "color-steel-light": { "$value": "#f0f4f5", "$type": "color" }, "color-red-medium": { "$value": "#faa59e", "$type": "color" }, "color-pink-medium": { "$value": "#f6a2bf", "$type": "color" }, "color-magenta-medium": { "$value": "#e3abec", "$type": "color" }, "color-purple-medium": { "$value": "#c5b1e7", "$type": "color" }, "color-navy-medium": { "$value": "#b3bbe5", "$type": "color" }, "color-blue-medium": { "$value": "#9ed1fa", "$type": "color" }, "color-cyan-medium": { "$value": "#9adffe", "$type": "color" }, "color-green-medium": { "$value": "#b8e0b9", "$type": "color" }, "color-yellow-medium": { "$value": "#ffe599", "$type": "color" }, "color-orange-medium": { "$value": "#ffd699", "$type": "color" }, "color-dahong-medium": { "$value": "#ffb199", "$type": "color" }, "color-brown-medium": { "$value": "#d9c6bf", "$type": "color" }, "color-iron-medium": { "$value": "#cccccc", "$type": "color" }, "color-steel-medium": { "$value": "#c3cfd5", "$type": "color" }, "checked-color-background": { "$value": "#03aefc1a", "$type": "color" }, "headercolor": { "$value": "linear-gradient(90deg, #193833 0%, #1e5149 100%)", "$type": "color" }, "line-style": { "$value": "linear-gradient(135deg, #ffffff 0%, #0000001a 50%, #ffffff 100%)", "$type": "color" }, "box__drop-shadow": { "$value": { "color": "#00000029", "type": "dropShadow", "x": 0, "y": 8, "blur": 24, "spread": 0 }, "$type": "boxShadow" }, "fontSize": { "0": { "$value": 12, "$type": "fontSizes" }, "1": { "$value": 14, "$type": "fontSizes" }, "2": { "$value": 16, "$type": "fontSizes" }, "3": { "$value": 20, "$type": "fontSizes" } }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-0}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.3}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-1}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.2}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-1}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.1}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-2}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.1}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-1}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.0}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "
": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-2}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.0}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "

": { "$value": { "fontFamily": "{fontFamilies.pretendard}", "fontWeight": "{fontWeights.pretendard-2}", "lineHeight": "{lineHeights.0}", "fontSize": "{fontSize.0}", "letterSpacing": "{letterSpacing.0}", "paragraphSpacing": "{paragraphSpacing.0}", "paragraphIndent": "{paragraphIndent.0}", "textCase": "{textCase.none}", "textDecoration": "{textDecoration.none}" }, "$type": "typography" }, "textCase": { "none": { "$value": "none", "$type": "textCase" } }, "textDecoration": { "none": { "$value": "none", "$type": "textDecoration" } }, "paragraphIndent": { "0": { "$value": "0px", "$type": "dimension" } } }, "light": { "fg": { "default": { "$value": "{colors.black}", "$type": "color" }, "muted": { "$value": "{colors.gray.700}", "$type": "color" }, "subtle": { "$value": "{colors.gray.500}", "$type": "color" } }, "bg": { "default": { "$value": "{colors.white}", "$type": "color" }, "muted": { "$value": "{colors.gray.100}", "$type": "color" }, "subtle": { "$value": "{colors.gray.200}", "$type": "color" } }, "accent": { "default": { "$value": "{colors.indigo.400}", "$type": "color" }, "onAccent": { "$value": "{colors.white}", "$type": "color" }, "bg": { "$value": "{colors.indigo.200}", "$type": "color" } }, "shadows": { "default": { "$value": "{colors.gray.900}", "$type": "color" } } }, "dark": { "fg": { "default": { "$value": "{colors.white}", "$type": "color" }, "muted": { "$value": "{colors.gray.300}", "$type": "color" }, "subtle": { "$value": "{colors.gray.500}", "$type": "color" } }, "bg": { "default": { "$value": "{colors.gray.900}", "$type": "color" }, "muted": { "$value": "{colors.gray.700}", "$type": "color" }, "subtle": { "$value": "{colors.gray.600}", "$type": "color" } }, "accent": { "default": { "$value": "{colors.indigo.600}", "$type": "color" }, "onAccent": { "$value": "{colors.white}", "$type": "color" }, "bg": { "$value": "{colors.indigo.800}", "$type": "color" } }, "shadows": { "default": { "$value": "rgba({colors.black}, 0.3)", "$type": "color" } } }, "theme": { "button": { "primary": { "background": { "$value": "{accent.default}", "$type": "color" }, "text": { "$value": "{accent.onAccent}", "$type": "color" } }, "borderRadius": { "$value": "{borderRadius.lg}", "$type": "borderRadius" }, "borderWidth": { "$value": "{dimension.sm}", "$type": "borderWidth" } }, "card": { "borderRadius": { "$value": "{borderRadius.lg}", "$type": "borderRadius" }, "background": { "$value": "{bg.default}", "$type": "color" }, "padding": { "$value": "{dimension.md}", "$type": "dimension" } }, "boxShadow": { "default": { "$value": [ { "x": 5, "y": 5, "spread": 3, "color": "rgba({shadows.default}, 0.15)", "blur": 5, "$type": "dropShadow" }, { "x": 4, "y": 4, "spread": 6, "color": "#00000033", "blur": 5, "$type": "innerShadow" } ], "$type": "boxShadow" } }, "typography": { "H1": { "Bold": { "$value": { "fontFamily": "{fontFamilies.heading}", "fontWeight": "{fontWeights.headingBold}", "lineHeight": "{lineHeights.heading}", "fontSize": "{fontSizes.h1}", "paragraphSpacing": "{paragraphSpacing.h1}", "letterSpacing": "{letterSpacing.decreased}" }, "$type": "typography" }, "Regular": { "$value": { "fontFamily": "{fontFamilies.heading}", "fontWeight": "{fontWeights.headingRegular}", "lineHeight": "{lineHeights.heading}", "fontSize": "{fontSizes.h1}", "paragraphSpacing": "{paragraphSpacing.h1}", "letterSpacing": "{letterSpacing.decreased}" }, "$type": "typography" } }, "H2": { "Bold": { "$value": { "fontFamily": "{fontFamilies.heading}", "fontWeight": "{fontWeights.headingBold}", "lineHeight": "{lineHeights.heading}", "fontSize": "{fontSizes.h2}", "paragraphSpacing": "{paragraphSpacing.h2}", "letterSpacing": "{letterSpacing.decreased}" }, "$type": "typography" }, "Regular": { "$value": { "fontFamily": "{fontFamilies.heading}", "fontWeight": "{fontWeights.headingRegular}", "lineHeight": "{lineHeights.heading}", "fontSize": "{fontSizes.h2}", "paragraphSpacing": "{paragraphSpacing.h2}", "letterSpacing": "{letterSpacing.decreased}" }, "$type": "typography" } }, "Body": { "$value": { "fontFamily": "{fontFamilies.body}", "fontWeight": "{fontWeights.bodyRegular}", "lineHeight": "{lineHeights.heading}", "fontSize": "{fontSizes.body}", "paragraphSpacing": "{paragraphSpacing.h2}" }, "$type": "typography" } } }, "$themes": [], "$metadata": { "tokenSetOrder": [ "core", "light", "dark", "theme" ] } }