{ "$schema": "https://designlasagna.recipes/v0.2/tokens.json", "schemaVersion": "0.2.0", "generatedAt": "2026-06-15T14:39:59.631Z", "source": { "files": [ { "file": "Border.tokens.json", "mode": "base" }, { "file": "Color.dark.tokens.json", "mode": "dark" }, { "file": "Color.light.tokens.json", "mode": "light" }, { "file": "Component.dark.tokens.json", "mode": "dark" }, { "file": "Component.light.tokens.json", "mode": "light" }, { "file": "Effect.tokens.json", "mode": "base" }, { "file": "Layout container.lg.tokens.json", "mode": "base" }, { "file": "Layout container.md.tokens.json", "mode": "base" }, { "file": "Layout container.sm.tokens.json", "mode": "base" }, { "file": "Layout page.lg.tokens.json", "mode": "base" }, { "file": "Layout page.md.tokens.json", "mode": "base" }, { "file": "Layout page.sm.tokens.json", "mode": "base" }, { "file": "Primitives.tokens.json", "mode": "base" }, { "file": "Size.tokens.json", "mode": "base" }, { "file": "Spacing.tokens.json", "mode": "base" }, { "file": "Typography size.max.tokens.json", "mode": "max" }, { "file": "Typography size.min.tokens.json", "mode": "min" }, { "file": "Typography.tokens.json", "mode": "base" } ] }, "counts": { "total": 354, "byGroup": { "Border": 11, "Color": 127, "Component": 8, "Primitive": 119, "Size": 3, "Spacing": 12, "Typography": 68, "Unknown": 6 }, "byCategory": { "radius": 6, "width": 5, "animation": 2, "background": 29, "border": 31, "icon": 17, "illustration": 6, "legends": 16, "risk": 8, "state-layer:opacity": 4, "state-layer": 2, "text": 20, "alert": 4, "icon-button": 1, "toggle": 3, "color": 65, "size": 3, "spacing": 12, "typography": 31, "Control": 3, "Scale": 12, "body:default": 1, "body:lg": 1, "body:sm": 1, "caption:default": 1, "display:default": 1, "font-family": 6, "font-size:body": 3, "font-size:caption": 1, "font-size:display": 1, "font-size:heading": 6, "font-size:label": 3, "font-size:value": 5, "font-style": 1, "font-weight": 4, "heading:level-1": 1, "heading:level-2": 1, "heading:level-3": 1, "heading:level-4": 1, "heading:level-5": 1, "heading:level-6": 1, "label:default": 1, "label:lg": 1, "label:sm": 1, "line-height:body": 3, "line-height:caption": 1, "line-height:display": 1, "line-height:heading": 6, "line-height:label": 3, "line-height:value": 5, "value:2xl": 1, "value:lg": 1, "value:md": 1, "value:sm": 1, "value:xl": 1, "container": 1, "grid": 4, "viewport": 1 } }, "tokens": [ { "id": "radius.2xs", "path": [ "radius", "2xs" ], "originalPath": [ "radius", "2xs" ], "group": "Border", "category": "radius", "type": "dimension", "description": "2xs border radius.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-border-radius-2xs", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:71", "com.figma.aliasData": { "targetVariableId": "VariableID:13058:5852", "targetVariableName": "border/radius/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "radius.lg", "path": [ "radius", "lg" ], "originalPath": [ "radius", "lg" ], "group": "Border", "category": "radius", "type": "dimension", "description": "Lg border radius.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.16}" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": "--lfds-border-radius-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:65", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:927", "targetVariableName": "border/radius/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "radius.md", "path": [ "radius", "md" ], "originalPath": [ "radius", "md" ], "group": "Border", "category": "radius", "type": "dimension", "description": "Md border radius.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.12}" }, "resolved": { "base": "12px" }, "aliasChain": "12px", "cssVariable": "--lfds-border-radius-md", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:66", "com.figma.aliasData": { "targetVariableId": "VariableID:13181:531", "targetVariableName": "border/radius/12", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "radius.round", "path": [ "radius", "round" ], "originalPath": [ "radius", "round" ], "group": "Border", "category": "radius", "type": "dimension", "description": "Used to make components and objects round.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.max}" }, "resolved": { "base": "100000px" }, "aliasChain": "100000px", "cssVariable": "--lfds-border-radius-round", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:68", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:928", "targetVariableName": "border/radius/max", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "radius.sm", "path": [ "radius", "sm" ], "originalPath": [ "radius", "sm" ], "group": "Border", "category": "radius", "type": "dimension", "description": "Sm border radius.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.8}" }, "resolved": { "base": "8px" }, "aliasChain": "8px", "cssVariable": "--lfds-border-radius-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:67", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:926", "targetVariableName": "border/radius/8", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "radius.xs", "path": [ "radius", "xs" ], "originalPath": [ "radius", "xs" ], "group": "Border", "category": "radius", "type": "dimension", "description": "Xs border radius.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.radius.4}" }, "resolved": { "base": "4px" }, "aliasChain": "4px", "cssVariable": "--lfds-border-radius-xs", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:69", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:925", "targetVariableName": "border/radius/4", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "width.default", "path": [ "width", "default" ], "originalPath": [ "width", "default" ], "group": "Border", "category": "width", "type": "dimension", "description": "Use as divider or decorative border.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.width.1}" }, "resolved": { "base": "1px" }, "aliasChain": "1px", "cssVariable": "--lfds-border-width-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:70", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:941", "targetVariableName": "border/width/1", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "width.emphasis", "path": [ "width", "emphasis" ], "originalPath": [ "width", "emphasis" ], "group": "Border", "category": "width", "type": "dimension", "description": "Use as divider or decorative border, when it needs greater visual weight.", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.width.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-border-width-emphasis", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:64", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:942", "targetVariableName": "border/width/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "width.focus", "path": [ "width", "focus" ], "originalPath": [ "width", "focus" ], "group": "Border", "category": "width", "type": "dimension", "description": "Use to emphasize interaction on focus state. (Not mandatory to use on interactive elements.) ", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.width.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-border-width-focus", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:73", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:942", "targetVariableName": "border/width/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "width.hover", "path": [ "width", "hover" ], "originalPath": [ "width", "hover" ], "group": "Border", "category": "width", "type": "dimension", "description": "Use to emphasize interaction on hover state if needed. (Not mandatory to use on interactive elements.) ", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.width.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-border-width-hover", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:72", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:942", "targetVariableName": "border/width/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "width.selected", "path": [ "width", "selected" ], "originalPath": [ "width", "selected" ], "group": "Border", "category": "width", "type": "dimension", "description": "Use to emphasize interaction on selected state. (Not mandatory to use on interactive elements.) ", "tags": [], "sourceFiles": [ "Border.tokens.json" ], "modes": { "base": "{border.width.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-border-width-selected", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:74", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:942", "targetVariableName": "border/width/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "animation.primary", "path": [ "animation", "primary" ], "originalPath": [ "animation", "primary" ], "group": "Color", "category": "animation", "type": "color", "description": "Use as primary color on animations.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-animation-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4375:774", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4375:774", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "animation.secondary", "path": [ "animation", "secondary" ], "originalPath": [ "animation", "secondary" ], "group": "Color", "category": "animation", "type": "color", "description": "Use as secondary color on animations.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.400}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#eb5c5c" }, "aliasChain": [], "cssVariable": "--lfds-color-animation-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4375:775", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4375:775", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.brand-primary", "path": [ "background", "brand-primary" ], "originalPath": [ "background", "brand-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use when you want to increase brand identity in your design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-background-brand-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:13977:5638", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:13977:5638", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.brand-secondary", "path": [ "background", "brand-secondary" ], "originalPath": [ "background", "brand-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use when you want to increase brand identity in your design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-background-brand-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:13977:5639", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:13977:5639", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-primary", "path": [ "background", "button-primary" ], "originalPath": [ "background", "button-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as primary button background.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3204:8518", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3204:8518", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-primary-pressed", "path": [ "background", "button-primary-pressed" ], "originalPath": [ "background", "button-primary-pressed" ], "group": "Color", "category": "background", "type": "color", "description": "Deprecated.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.450}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#52a8e1" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-primary-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21861:2", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1907", "targetVariableName": "color/Blue/450", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21861:2", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-quaternary", "path": [ "background", "button-quaternary" ], "originalPath": [ "background", "button-quaternary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as quarternary button background.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.600}" }, "resolved": { "light": "#c8041e", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-quaternary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4399:1371", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4399:1371", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1881", "targetVariableName": "color/Red/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-quaternary-pressed", "path": [ "background", "button-quaternary-pressed" ], "originalPath": [ "background", "button-quaternary-pressed" ], "group": "Color", "category": "background", "type": "color", "description": "Deprecated.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.350}", "light": "{color.Red.700}" }, "resolved": { "light": "#870315", "dark": "#ee7979" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-quaternary-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21861:5", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1902", "targetVariableName": "color/Red/350", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21861:5", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1923", "targetVariableName": "color/Red/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-secondary", "path": [ "background", "button-secondary" ], "originalPath": [ "background", "button-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as secondary button background.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.transparent.neutral-0-a0}", "light": "{color.transparent.neutral-0-a0}" }, "resolved": { "light": "#ffffff00", "dark": "#ffffff00" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3684:1346", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1870", "targetVariableName": "color/transparent/neutral-0-a0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3684:1346", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1870", "targetVariableName": "color/transparent/neutral-0-a0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-secondary-pressed", "path": [ "background", "button-secondary-pressed" ], "originalPath": [ "background", "button-secondary-pressed" ], "group": "Color", "category": "background", "type": "color", "description": "Deprecated.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1050}", "light": "{color.Blue.100}" }, "resolved": { "light": "#f6fbfe", "dark": "#000305" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-secondary-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21861:3", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1897", "targetVariableName": "color/Blue/1050", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21861:3", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1889", "targetVariableName": "color/Blue/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-tertiary", "path": [ "background", "button-tertiary" ], "originalPath": [ "background", "button-tertiary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as tertiary button background.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.Blue.200}" }, "resolved": { "light": "#e3f4fc", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3555:7218", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3555:7218", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.button-tertiary-pressed", "path": [ "background", "button-tertiary-pressed" ], "originalPath": [ "background", "button-tertiary-pressed" ], "group": "Color", "category": "background", "type": "color", "description": "Deprecated.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.950}", "light": "{color.Blue.250}" }, "resolved": { "light": "#c0e5f8", "dark": "#001b33" }, "aliasChain": [], "cssVariable": "--lfds-color-background-button-tertiary-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21861:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1893", "targetVariableName": "color/Blue/950", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21861:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.disabled", "path": [ "background", "disabled" ], "originalPath": [ "background", "disabled" ], "group": "Color", "category": "background", "type": "color", "description": "Use on disabled interactive elements.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1050}", "light": "{color.neutral.100}" }, "resolved": { "light": "#f5f5f5", "dark": "#000305" }, "aliasChain": [], "cssVariable": "--lfds-color-background-disabled", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2224:5138", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1897", "targetVariableName": "color/Blue/1050", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2224:5138", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.error", "path": [ "background", "error" ], "originalPath": [ "background", "error" ], "group": "Color", "category": "background", "type": "color", "description": "Use to signal error, e.g. in alerts.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.750}", "light": "{color.Red.200}" }, "resolved": { "light": "#f9d2d2", "dark": "#730312" }, "aliasChain": [], "cssVariable": "--lfds-color-background-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2621:12602", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1891", "targetVariableName": "color/Red/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2621:12602", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1884", "targetVariableName": "color/Red/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.highlight-primary", "path": [ "background", "highlight-primary" ], "originalPath": [ "background", "highlight-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use to highlight content.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.Blue.200}" }, "resolved": { "light": "#e3f4fc", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-background-highlight-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7284:13505", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7284:13505", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.highlight-secondary", "path": [ "background", "highlight-secondary" ], "originalPath": [ "background", "highlight-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use to highlight content.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.750}", "light": "{color.Red.100}" }, "resolved": { "light": "#fdeded", "dark": "#730312" }, "aliasChain": [], "cssVariable": "--lfds-color-background-highlight-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7284:13506", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1891", "targetVariableName": "color/Red/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7284:13506", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1890", "targetVariableName": "color/Red/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.highlight-tertiary", "path": [ "background", "highlight-tertiary" ], "originalPath": [ "background", "highlight-tertiary" ], "group": "Color", "category": "background", "type": "color", "description": "Use to highlight content.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.550}", "light": "{color.Green.100}" }, "resolved": { "light": "#e1edde", "dark": "#253a21" }, "aliasChain": [], "cssVariable": "--lfds-color-background-highlight-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7284:13507", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1875", "targetVariableName": "color/Green/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7284:13507", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1894", "targetVariableName": "color/Green/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.info", "path": [ "background", "info" ], "originalPath": [ "background", "info" ], "group": "Color", "category": "background", "type": "color", "description": "Use for neutral information, e.g. in alerts.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.850}", "light": "{color.Blue.250}" }, "resolved": { "light": "#c0e5f8", "dark": "#003666" }, "aliasChain": [], "cssVariable": "--lfds-color-background-info", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2621:12600", "com.figma.aliasData": { "targetVariableId": "VariableID:21708:140", "targetVariableName": "color/Blue/850", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2621:12600", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.notification-primary", "path": [ "background", "notification-primary" ], "originalPath": [ "background", "notification-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use for notifications.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.600}" }, "resolved": { "light": "#c8041e", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-background-notification-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3810:709", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3810:709", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1881", "targetVariableName": "color/Red/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.notification-secondary", "path": [ "background", "notification-secondary" ], "originalPath": [ "background", "notification-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use for notifications.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-background-notification-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3810:710", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3810:710", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.notification-tertiary", "path": [ "background", "notification-tertiary" ], "originalPath": [ "background", "notification-tertiary" ], "group": "Color", "category": "background", "type": "color", "description": "Use for notifications.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.200}", "light": "{color.neutral.400}" }, "resolved": { "light": "#666666", "dark": "#d6d6d6" }, "aliasChain": [], "cssVariable": "--lfds-color-background-notification-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3827:701", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3827:701", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.primary", "path": [ "background", "primary" ], "originalPath": [ "background", "primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as default background (primary).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1050}", "light": "{color.neutral.100}" }, "resolved": { "light": "#f5f5f5", "dark": "#000305" }, "aliasChain": [], "cssVariable": "--lfds-color-background-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14:786", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1897", "targetVariableName": "color/Blue/1050", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14:786", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.secondary", "path": [ "background", "secondary" ], "originalPath": [ "background", "secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as default background (secondary).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-background-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14:785", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14:785", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.selected", "path": [ "background", "selected" ], "originalPath": [ "background", "selected" ], "group": "Color", "category": "background", "type": "color", "description": "Use on interactive elements in selected state. (Not mandatory).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-background-selected", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3739:10729", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3739:10729", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.skeleton-primary", "path": [ "background", "skeleton-primary" ], "originalPath": [ "background", "skeleton-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use together with skeleton-secondary to create shimmer effect.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.800}", "light": "{color.Blue.100}" }, "resolved": { "light": "#f6fbfe", "dark": "#00427a" }, "aliasChain": [], "cssVariable": "--lfds-color-background-skeleton-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4270:6598", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4270:6598", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1889", "targetVariableName": "color/Blue/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.skeleton-secondary", "path": [ "background", "skeleton-secondary" ], "originalPath": [ "background", "skeleton-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use together with skeleton-primary to create shimmer effect.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.Blue.200}" }, "resolved": { "light": "#e3f4fc", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-background-skeleton-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4270:6599", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4270:6599", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.success", "path": [ "background", "success" ], "originalPath": [ "background", "success" ], "group": "Color", "category": "background", "type": "color", "description": "Use to signal success, e.g. in alerts.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.550}", "light": "{color.Green.100}" }, "resolved": { "light": "#e1edde", "dark": "#253a21" }, "aliasChain": [], "cssVariable": "--lfds-color-background-success", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2621:12601", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1875", "targetVariableName": "color/Green/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2621:12601", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1894", "targetVariableName": "color/Green/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.tertiary", "path": [ "background", "tertiary" ], "originalPath": [ "background", "tertiary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as default background (tertiary).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.neutral.200}" }, "resolved": { "light": "#d6d6d6", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-background-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3850:111", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3850:111", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.transparent-primary", "path": [ "background", "transparent-primary" ], "originalPath": [ "background", "transparent-primary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as transparent background.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.transparent.blue-1000-a0}", "light": "{color.transparent.neutral-0-a0}" }, "resolved": { "light": "#ffffff00", "dark": "#00162900" }, "aliasChain": [], "cssVariable": "--lfds-color-background-transparent-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3154:1374", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1869", "targetVariableName": "color/transparent/blue-1000-a0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3154:1374", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1870", "targetVariableName": "color/transparent/neutral-0-a0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.transparent-secondary", "path": [ "background", "transparent-secondary" ], "originalPath": [ "background", "transparent-secondary" ], "group": "Color", "category": "background", "type": "color", "description": "Use as backdrop for floating elements. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.transparent.blue-900-a75}", "light": "{color.transparent.blue-900-a75}" }, "resolved": { "light": "#00315cbf", "dark": "#00315cbf" }, "aliasChain": [], "cssVariable": "--lfds-color-background-transparent-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3793:682", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1883", "targetVariableName": "color/transparent/blue-900-a75", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3793:682", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1883", "targetVariableName": "color/transparent/blue-900-a75", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "background.warning", "path": [ "background", "warning" ], "originalPath": [ "background", "warning" ], "group": "Color", "category": "background", "type": "color", "description": "Use for warnings, e.g. in alerts.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Yellow.400}", "light": "{color.Yellow.100}" }, "resolved": { "light": "#fff5cc", "dark": "#d4b102" }, "aliasChain": [], "cssVariable": "--lfds-color-background-warning", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2620:12599", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1908", "targetVariableName": "color/Yellow/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2620:12599", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1922", "targetVariableName": "color/Yellow/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.brand-primary", "path": [ "border", "brand-primary" ], "originalPath": [ "border", "brand-primary" ], "group": "Color", "category": "border", "type": "color", "description": "Use when you want to increase brand identity in your design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-brand-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5550:4551", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5550:4551", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.brand-secondary", "path": [ "border", "brand-secondary" ], "originalPath": [ "border", "brand-secondary" ], "group": "Color", "category": "border", "type": "color", "description": "Use when you want to increase brand identity in your design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-border-brand-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5550:4552", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5550:4552", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.disabled", "path": [ "border", "disabled" ], "originalPath": [ "border", "disabled" ], "group": "Color", "category": "border", "type": "color", "description": "Use in disabled state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.500}", "light": "{color.neutral.250}" }, "resolved": { "light": "#c2c2c2", "dark": "#292929" }, "aliasChain": [], "cssVariable": "--lfds-color-border-disabled", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2224:5256", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1921", "targetVariableName": "color/neutral/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2224:5256", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1911", "targetVariableName": "color/neutral/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.error", "path": [ "border", "error" ], "originalPath": [ "border", "error" ], "group": "Color", "category": "border", "type": "color", "description": "Use in error state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-border-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3206:2613", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3206:2613", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.focus", "path": [ "border", "focus" ], "originalPath": [ "border", "focus" ], "group": "Color", "category": "border", "type": "color", "description": "Use in focus state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-focus", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3078:2621", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3078:2621", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.focus-outline", "path": [ "border", "focus-outline" ], "originalPath": [ "border", "focus-outline" ], "group": "Color", "category": "border", "type": "color", "description": "Use for tab focus. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.magenta.500}", "light": "{color.magenta.500}" }, "resolved": { "light": "#c900bc", "dark": "#c900bc" }, "aliasChain": [], "cssVariable": "--lfds-color-border-focus-outline", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:22558:137", "com.figma.aliasData": { "targetVariableId": "VariableID:22558:136", "targetVariableName": "color/magenta/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:22558:137", "com.figma.aliasData": { "targetVariableId": "VariableID:22558:136", "targetVariableName": "color/magenta/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.hover", "path": [ "border", "hover" ], "originalPath": [ "border", "hover" ], "group": "Color", "category": "border", "type": "color", "description": "Use in hover state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-hover", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7060:322", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7060:322", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-button-primary", "path": [ "border", "on-button-primary" ], "originalPath": [ "border", "on-button-primary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as border color on primary button.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.450}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#52a8e1" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-button-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14525:6369", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1907", "targetVariableName": "color/Blue/450", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14525:6369", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-button-secondary", "path": [ "border", "on-button-secondary" ], "originalPath": [ "border", "on-button-secondary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as border color on secondary button.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-button-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3650:508", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3650:508", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-button-tertiary", "path": [ "border", "on-button-tertiary" ], "originalPath": [ "border", "on-button-tertiary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as border color on tertiary button.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.700}", "light": "{color.Blue.250}" }, "resolved": { "light": "#c0e5f8", "dark": "#005aa0" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-button-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9669:827", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9669:827", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-error", "path": [ "border", "on-error" ], "originalPath": [ "border", "on-error" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with success background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.450}", "light": "{color.Red.700}" }, "resolved": { "light": "#870315", "dark": "#e74040" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6831:1536", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1926", "targetVariableName": "color/Red/450", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6831:1536", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1923", "targetVariableName": "color/Red/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-highlight-primary", "path": [ "border", "on-highlight-primary" ], "originalPath": [ "border", "on-highlight-primary" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with highlight primary background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.800}", "light": "{color.Blue.250}" }, "resolved": { "light": "#c0e5f8", "dark": "#00427a" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-highlight-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7411:100", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7411:100", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-highlight-secondary", "path": [ "border", "on-highlight-secondary" ], "originalPath": [ "border", "on-highlight-secondary" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with highlight secondary background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.700}", "light": "{color.Red.200}" }, "resolved": { "light": "#f9d2d2", "dark": "#870315" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-highlight-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7411:101", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1923", "targetVariableName": "color/Red/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7411:101", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1884", "targetVariableName": "color/Red/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-highlight-tertiary", "path": [ "border", "on-highlight-tertiary" ], "originalPath": [ "border", "on-highlight-tertiary" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with highlight tertiary background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.500}", "light": "{color.Green.150}" }, "resolved": { "light": "#c9dec4", "dark": "#3e6237" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-highlight-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7411:102", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1876", "targetVariableName": "color/Green/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7411:102", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1880", "targetVariableName": "color/Green/150", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-info", "path": [ "border", "on-info" ], "originalPath": [ "border", "on-info" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with info background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.550}", "light": "{color.Blue.600}" }, "resolved": { "light": "#1f74ad", "dark": "#2792d8" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-info", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6831:1535", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1915", "targetVariableName": "color/Blue/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6831:1535", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-success", "path": [ "border", "on-success" ], "originalPath": [ "border", "on-success" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with success background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.400}", "light": "{color.Green.350}" }, "resolved": { "light": "#6ea762", "dark": "#6ea762" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-success", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6831:1539", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1877", "targetVariableName": "color/Green/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6831:1539", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1878", "targetVariableName": "color/Green/350", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.on-warning", "path": [ "border", "on-warning" ], "originalPath": [ "border", "on-warning" ], "group": "Color", "category": "border", "type": "color", "description": "Use in combination with warning background color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Yellow.200}", "light": "{color.Yellow.350}" }, "resolved": { "light": "#ebbd00", "dark": "#ffe680" }, "aliasChain": [], "cssVariable": "--lfds-color-border-on-warning", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6831:1538", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1872", "targetVariableName": "color/Yellow/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6831:1538", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1874", "targetVariableName": "color/Yellow/350", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.pressed", "path": [ "border", "pressed" ], "originalPath": [ "border", "pressed" ], "group": "Color", "category": "border", "type": "color", "description": "Use in hover state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:24113:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:24113:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.primary", "path": [ "border", "primary" ], "originalPath": [ "border", "primary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as default border (primary).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1050}", "light": "{color.neutral.100}" }, "resolved": { "light": "#f5f5f5", "dark": "#000305" }, "aliasChain": [], "cssVariable": "--lfds-color-border-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3077:2619", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1897", "targetVariableName": "color/Blue/1050", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3077:2619", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.secondary", "path": [ "border", "secondary" ], "originalPath": [ "border", "secondary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as default border (secondary).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.neutral.200}" }, "resolved": { "light": "#d6d6d6", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-border-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14:790", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14:790", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.selected", "path": [ "border", "selected" ], "originalPath": [ "border", "selected" ], "group": "Color", "category": "border", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-border-selected", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3739:10731", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3739:10731", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.selected-secondary", "path": [ "border", "selected-secondary" ], "originalPath": [ "border", "selected-secondary" ], "group": "Color", "category": "border", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.400}" }, "resolved": { "light": "#eb5c5c", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-border-selected-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:7735:1334", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:7735:1334", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.tertiary", "path": [ "border", "tertiary" ], "originalPath": [ "border", "tertiary" ], "group": "Color", "category": "border", "type": "color", "description": "Use as default border (tertiary). Default on form components.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.600}", "light": "{color.neutral.300}" }, "resolved": { "light": "#7a7a7a", "dark": "#1f74ad" }, "aliasChain": [], "cssVariable": "--lfds-color-border-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2224:4921", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2224:4921", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1906", "targetVariableName": "color/neutral/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.disabled", "path": [ "icon", "disabled" ], "originalPath": [ "icon", "disabled" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color in disabled state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.400}", "light": "{color.neutral.250}" }, "resolved": { "light": "#c2c2c2", "dark": "#666666" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-disabled", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4919:148", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4919:148", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1911", "targetVariableName": "color/neutral/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.error", "path": [ "icon", "error" ], "originalPath": [ "icon", "error" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color in error state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3172:6877", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3172:6877", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.focused", "path": [ "icon", "focused" ], "originalPath": [ "icon", "focused" ], "group": "Color", "category": "icon", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-focused", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:23829:5", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:23829:5", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.hovered", "path": [ "icon", "hovered" ], "originalPath": [ "icon", "hovered" ], "group": "Color", "category": "icon", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-hovered", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:23829:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:23829:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.inverted", "path": [ "icon", "inverted" ], "originalPath": [ "icon", "inverted" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on negative backgrounds.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-inverted", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3491:6287", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3491:6287", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-button-primary", "path": [ "icon", "on-button-primary" ], "originalPath": [ "icon", "on-button-primary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on primary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-button-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3887:696", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3887:696", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-button-secondary", "path": [ "icon", "on-button-secondary" ], "originalPath": [ "icon", "on-button-secondary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on secondary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-button-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3887:697", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3887:697", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-button-tertiary", "path": [ "icon", "on-button-tertiary" ], "originalPath": [ "icon", "on-button-tertiary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on tertiary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-button-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5986:731", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5986:731", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-error", "path": [ "icon", "on-error" ], "originalPath": [ "icon", "on-error" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on error alert.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.100}", "light": "{color.Red.750}" }, "resolved": { "light": "#730312", "dark": "#fdeded" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3894:679", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1890", "targetVariableName": "color/Red/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3894:679", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1891", "targetVariableName": "color/Red/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-info", "path": [ "icon", "on-info" ], "originalPath": [ "icon", "on-info" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on info alert.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.250}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#c0e5f8" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-info", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3894:678", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3894:678", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-success", "path": [ "icon", "on-success" ], "originalPath": [ "icon", "on-success" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on success alert.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.150}", "light": "{color.Green.300}" }, "resolved": { "light": "#86b67c", "dark": "#c9dec4" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-success", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3894:681", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1880", "targetVariableName": "color/Green/150", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3894:681", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1886", "targetVariableName": "color/Green/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.on-warning", "path": [ "icon", "on-warning" ], "originalPath": [ "icon", "on-warning" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as icon color on warning alert.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.500}", "light": "{color.neutral.500}" }, "resolved": { "light": "#292929", "dark": "#292929" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-on-warning", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3894:680", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1921", "targetVariableName": "color/neutral/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3894:680", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1921", "targetVariableName": "color/neutral/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.pressed", "path": [ "icon", "pressed" ], "originalPath": [ "icon", "pressed" ], "group": "Color", "category": "icon", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.350}", "light": "{color.Blue.750}" }, "resolved": { "light": "#004b85", "dark": "#91d2f3" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:23829:6", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1910", "targetVariableName": "color/Blue/350", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:23829:6", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1896", "targetVariableName": "color/Blue/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.primary", "path": [ "icon", "primary" ], "originalPath": [ "icon", "primary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as primary icon color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:189:11381", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:189:11381", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.secondary", "path": [ "icon", "secondary" ], "originalPath": [ "icon", "secondary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as secondary icon color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.100}", "light": "{color.neutral.300}" }, "resolved": { "light": "#7a7a7a", "dark": "#f5f5f5" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:189:11388", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:189:11388", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1906", "targetVariableName": "color/neutral/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.selected", "path": [ "icon", "selected" ], "originalPath": [ "icon", "selected" ], "group": "Color", "category": "icon", "type": "color", "description": "Use in selected states. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-selected", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3777:3873", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3777:3873", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon.tertiary", "path": [ "icon", "tertiary" ], "originalPath": [ "icon", "tertiary" ], "group": "Color", "category": "icon", "type": "color", "description": "Use as tertiary icon color. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.400}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#eb5c5c" }, "aliasChain": [], "cssVariable": "--lfds-color-icon-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3988:38935", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3988:38935", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.accent-primary", "path": [ "illustration", "accent-primary" ], "originalPath": [ "illustration", "accent-primary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as primary accent color on illustrations – in combination with base-primary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.400}" }, "resolved": { "light": "#eb5c5c", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-accent-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3988:38937", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3988:38937", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.accent-secondary", "path": [ "illustration", "accent-secondary" ], "originalPath": [ "illustration", "accent-secondary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as secondary accent color on illustrations – in combination with base-secondary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-accent-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9649:1408", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9649:1408", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.accent-tertiary", "path": [ "illustration", "accent-tertiary" ], "originalPath": [ "illustration", "accent-tertiary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as tertiary accent color on illustrations – in combination with base-tertiary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.700}", "light": "{color.neutral.250}" }, "resolved": { "light": "#c2c2c2", "dark": "#005aa0" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-accent-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9649:1415", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9649:1415", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1911", "targetVariableName": "color/neutral/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.base-primary", "path": [ "illustration", "base-primary" ], "originalPath": [ "illustration", "base-primary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as primary base color on illustrations – in combination with accent-primary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-base-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3988:38936", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3988:38936", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.base-secondary", "path": [ "illustration", "base-secondary" ], "originalPath": [ "illustration", "base-secondary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as secondary base color on illustrations – in combination with accent-secondary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-base-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9649:1409", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9649:1409", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "illustration.base-tertiary", "path": [ "illustration", "base-tertiary" ], "originalPath": [ "illustration", "base-tertiary" ], "group": "Color", "category": "illustration", "type": "color", "description": "Use as tertiary base color on illustrations – in combination with accent-tertiary.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.700}", "light": "{color.neutral.250}" }, "resolved": { "light": "#c2c2c2", "dark": "#005aa0" }, "aliasChain": [], "cssVariable": "--lfds-color-illustration-base-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9649:1416", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9649:1416", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1911", "targetVariableName": "color/neutral/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.four-100", "path": [ "legends", "four-100" ], "originalPath": [ "legends", "four-100" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.200}", "light": "{color.Green.400}" }, "resolved": { "light": "#6ea762", "dark": "#abcca4" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-four-100", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5047:1476", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1879", "targetVariableName": "color/Green/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5047:1476", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1877", "targetVariableName": "color/Green/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-100", "path": [ "legends", "one-100" ], "originalPath": [ "legends", "one-100" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-100", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1331", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1331", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-200", "path": [ "legends", "one-200" ], "originalPath": [ "legends", "one-200" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-200", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1332", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1332", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-300", "path": [ "legends", "one-300" ], "originalPath": [ "legends", "one-300" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.500}", "light": "{color.Blue.600}" }, "resolved": { "light": "#1f74ad", "dark": "#49a3df" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-300", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1333", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1930", "targetVariableName": "color/Blue/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1333", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-400", "path": [ "legends", "one-400" ], "originalPath": [ "legends", "one-400" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.600}", "light": "{color.Blue.500}" }, "resolved": { "light": "#49a3df", "dark": "#1f74ad" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-400", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1334", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1334", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1930", "targetVariableName": "color/Blue/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-500", "path": [ "legends", "one-500" ], "originalPath": [ "legends", "one-500" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.700}", "light": "{color.Blue.400}" }, "resolved": { "light": "#76bae7", "dark": "#005aa0" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-500", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1335", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1335", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.one-600", "path": [ "legends", "one-600" ], "originalPath": [ "legends", "one-600" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.800}", "light": "{color.Blue.300}" }, "resolved": { "light": "#b6e1f7", "dark": "#00427a" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-one-600", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1336", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1336", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.three-100", "path": [ "legends", "three-100" ], "originalPath": [ "legends", "three-100" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.200}", "light": "{color.neutral.400}" }, "resolved": { "light": "#666666", "dark": "#d6d6d6" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-three-100", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5047:1473", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5047:1473", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.three-200", "path": [ "legends", "three-200" ], "originalPath": [ "legends", "three-200" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.300}", "light": "{color.neutral.300}" }, "resolved": { "light": "#7a7a7a", "dark": "#7a7a7a" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-three-200", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5047:1474", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1906", "targetVariableName": "color/neutral/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5047:1474", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1906", "targetVariableName": "color/neutral/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.three-300", "path": [ "legends", "three-300" ], "originalPath": [ "legends", "three-300" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.400}", "light": "{color.neutral.200}" }, "resolved": { "light": "#d6d6d6", "dark": "#666666" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-three-300", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5047:1475", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5047:1475", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-100", "path": [ "legends", "two-100" ], "originalPath": [ "legends", "two-100" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.200}", "light": "{color.Red.700}" }, "resolved": { "light": "#870315", "dark": "#f9d2d2" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-100", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1031", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1884", "targetVariableName": "color/Red/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1031", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1923", "targetVariableName": "color/Red/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-200", "path": [ "legends", "two-200" ], "originalPath": [ "legends", "two-200" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.600}" }, "resolved": { "light": "#c8041e", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-200", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1032", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1032", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1881", "targetVariableName": "color/Red/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-300", "path": [ "legends", "two-300" ], "originalPath": [ "legends", "two-300" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.400}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#eb5c5c" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-300", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1033", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1033", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-400", "path": [ "legends", "two-400" ], "originalPath": [ "legends", "two-400" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.500}", "light": "{color.Red.400}" }, "resolved": { "light": "#eb5c5c", "dark": "#e40523" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-400", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1034", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1034", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1885", "targetVariableName": "color/Red/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-500", "path": [ "legends", "two-500" ], "originalPath": [ "legends", "two-500" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.600}", "light": "{color.Red.300}" }, "resolved": { "light": "#f08a8a", "dark": "#c8041e" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-500", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1035", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1881", "targetVariableName": "color/Red/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1035", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "legends.two-600", "path": [ "legends", "two-600" ], "originalPath": [ "legends", "two-600" ], "group": "Color", "category": "legends", "type": "color", "description": "Use in graphs.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.700}", "light": "{color.Red.200}" }, "resolved": { "light": "#f9d2d2", "dark": "#870315" }, "aliasChain": [], "cssVariable": "--lfds-color-legends-two-600", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2641:1036", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1923", "targetVariableName": "color/Red/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2641:1036", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1884", "targetVariableName": "color/Red/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-01", "path": [ "risk", "risk-01" ], "originalPath": [ "risk", "risk-01" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 1 (lowest).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.200}", "light": "{color.Blue.200}" }, "resolved": { "light": "#e3f4fc", "dark": "#e3f4fc" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-01", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2627:13080", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2627:13080", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-02", "path": [ "risk", "risk-02" ], "originalPath": [ "risk", "risk-02" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 2.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.300}", "light": "{color.Blue.300}" }, "resolved": { "light": "#b6e1f7", "dark": "#b6e1f7" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-02", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2627:13081", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2627:13081", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1919", "targetVariableName": "color/Blue/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-03", "path": [ "risk", "risk-03" ], "originalPath": [ "risk", "risk-03" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 3.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.200}", "light": "{color.Green.200}" }, "resolved": { "light": "#abcca4", "dark": "#abcca4" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-03", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2627:13083", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1879", "targetVariableName": "color/Green/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2627:13083", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1879", "targetVariableName": "color/Green/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-04", "path": [ "risk", "risk-04" ], "originalPath": [ "risk", "risk-04" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 4.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Green.300}", "light": "{color.Green.300}" }, "resolved": { "light": "#86b67c", "dark": "#86b67c" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-04", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2633:852", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1886", "targetVariableName": "color/Green/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2633:852", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1886", "targetVariableName": "color/Green/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-05", "path": [ "risk", "risk-05" ], "originalPath": [ "risk", "risk-05" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 5.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Yellow.200}", "light": "{color.Yellow.200}" }, "resolved": { "light": "#ffe680", "dark": "#ffe680" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-05", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1058", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1872", "targetVariableName": "color/Yellow/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1058", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1872", "targetVariableName": "color/Yellow/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-06", "path": [ "risk", "risk-06" ], "originalPath": [ "risk", "risk-06" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 6", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Yellow.300}", "light": "{color.Yellow.300}" }, "resolved": { "light": "#ffd114", "dark": "#ffd114" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-06", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1057", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1892", "targetVariableName": "color/Yellow/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1057", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1892", "targetVariableName": "color/Yellow/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-07", "path": [ "risk", "risk-07" ], "originalPath": [ "risk", "risk-07" ], "group": "Color", "category": "risk", "type": "color", "description": "Use to signal risk level 7 (highest).", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.300}" }, "resolved": { "light": "#f08a8a", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-07", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2637:1059", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2637:1059", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "risk.risk-default", "path": [ "risk", "risk-default" ], "originalPath": [ "risk", "risk-default" ], "group": "Color", "category": "risk", "type": "color", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.200}", "light": "{color.neutral.200}" }, "resolved": { "light": "#d6d6d6", "dark": "#d6d6d6" }, "aliasChain": [], "cssVariable": "--lfds-color-risk-risk-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2624:13069", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2624:13069", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "opacity.state.enabled", "path": [ "opacity", "state", "enabled" ], "originalPath": [ "opacity", "state", "enabled" ], "group": "Color", "category": "state-layer", "subCategory": "opacity", "type": "number", "description": "Use together with the background color token “state layer” to create an enabled/default state background tint.", "tags": [], "sourceFiles": [ "Effect.tokens.json" ], "modes": { "base": 0 }, "resolved": { "base": 0 }, "aliasChain": [], "cssVariable": "--lfds-effect-opacity-state-enabled", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:156" } } } }, { "id": "opacity.state.focused", "path": [ "opacity", "state", "focused" ], "originalPath": [ "opacity", "state", "focused" ], "group": "Color", "category": "state-layer", "subCategory": "opacity", "type": "number", "description": "Use together with the background color token “state layer” to create focus state background tint.", "tags": [], "sourceFiles": [ "Effect.tokens.json" ], "modes": { "base": 0.16 }, "resolved": { "base": 0.16 }, "aliasChain": [], "cssVariable": "--lfds-effect-opacity-state-focused", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:153" } } } }, { "id": "opacity.state.hover", "path": [ "opacity", "state", "hover" ], "originalPath": [ "opacity", "state", "hover" ], "group": "Color", "category": "state-layer", "subCategory": "opacity", "type": "number", "description": "Use together with the background color token “state layer” to create hover state background tint.", "tags": [], "sourceFiles": [ "Effect.tokens.json" ], "modes": { "base": 0.16 }, "resolved": { "base": 0.16 }, "aliasChain": [], "cssVariable": "--lfds-effect-opacity-state-hover", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:155" } } } }, { "id": "opacity.state.pressed", "path": [ "opacity", "state", "pressed" ], "originalPath": [ "opacity", "state", "pressed" ], "group": "Color", "category": "state-layer", "subCategory": "opacity", "type": "number", "description": "Use together with the background color token “state layer” to create pressed state background tint.", "tags": [], "sourceFiles": [ "Effect.tokens.json" ], "modes": { "base": 0.3 }, "resolved": { "base": 0.3 }, "aliasChain": [], "cssVariable": "--lfds-effect-opacity-state-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:154" } } } }, { "id": "state-layer.on-dark", "path": [ "state-layer", "on-dark" ], "originalPath": [ "state-layer", "on-dark" ], "group": "Color", "category": "state-layer", "type": "color", "description": "Use together with opacity tokens to define background color on a components different states. This token is used if the components default background is dark.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.500}", "light": "{color.Blue.350}" }, "resolved": { "light": "#91d2f3", "dark": "#49a3df" }, "aliasChain": [], "cssVariable": "--lfds-color-state-layer-on-dark", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:17239:8", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1930", "targetVariableName": "color/Blue/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:17239:8", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1910", "targetVariableName": "color/Blue/350", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "state-layer.on-light", "path": [ "state-layer", "on-light" ], "originalPath": [ "state-layer", "on-light" ], "group": "Color", "category": "state-layer", "type": "color", "description": "Use together with opacity tokens to define background color on a components different states. This token is used if the components default background is light.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.500}", "light": "{color.Blue.400}" }, "resolved": { "light": "#76bae7", "dark": "#49a3df" }, "aliasChain": [], "cssVariable": "--lfds-color-state-layer-on-light", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:17239:7", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1930", "targetVariableName": "color/Blue/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:17239:7", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.brand-primary", "path": [ "text", "brand-primary" ], "originalPath": [ "text", "brand-primary" ], "group": "Color", "category": "text", "type": "color", "description": "LF branded text - Primary. Use when you want to increase brand identity in you design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.100}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#f5f5f5" }, "aliasChain": [], "cssVariable": "--lfds-color-text-brand-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14:756", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14:756", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.brand-secondary", "path": [ "text", "brand-secondary" ], "originalPath": [ "text", "brand-secondary" ], "group": "Color", "category": "text", "type": "color", "description": "LF branded text - Secondary. Use when you want to increase brand identity in you design.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-text-brand-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:5013:1392", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:5013:1392", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.disabled", "path": [ "text", "disabled" ], "originalPath": [ "text", "disabled" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text in disabled states.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.250}", "light": "{color.neutral.400}" }, "resolved": { "light": "#666666", "dark": "#c2c2c2" }, "aliasChain": [], "cssVariable": "--lfds-color-text-disabled", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3541:17", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1911", "targetVariableName": "color/neutral/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3541:17", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.error", "path": [ "text", "error" ], "originalPath": [ "text", "error" ], "group": "Color", "category": "text", "type": "color", "description": "Use to highlight text in error messages and states.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-text-error", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:2226:1565", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:2226:1565", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.inverted", "path": [ "text", "inverted" ], "originalPath": [ "text", "inverted" ], "group": "Color", "category": "text", "type": "color", "description": "Use on negative backgrounds as inverted primary text color. ", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-text-inverted", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3810:711", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3810:711", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.link", "path": [ "text", "link" ], "originalPath": [ "text", "link" ], "group": "Color", "category": "text", "type": "color", "description": "Use as default link color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-text-link", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3670:5940", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3670:5940", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.link-focus", "path": [ "text", "link-focus" ], "originalPath": [ "text", "link-focus" ], "group": "Color", "category": "text", "type": "color", "description": "Use for links in hover state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.550}", "light": "{color.Blue.900}" }, "resolved": { "light": "#00315c", "dark": "#2792d8" }, "aliasChain": [], "cssVariable": "--lfds-color-text-link-focus", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:23465:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1915", "targetVariableName": "color/Blue/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:23465:4", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.link-hover", "path": [ "text", "link-hover" ], "originalPath": [ "text", "link-hover" ], "group": "Color", "category": "text", "type": "color", "description": "Use for links in hover state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.550}", "light": "{color.Blue.900}" }, "resolved": { "light": "#00315c", "dark": "#2792d8" }, "aliasChain": [], "cssVariable": "--lfds-color-text-link-hover", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:18006:8846", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1915", "targetVariableName": "color/Blue/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:18006:8846", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.link-pressed", "path": [ "text", "link-pressed" ], "originalPath": [ "text", "link-pressed" ], "group": "Color", "category": "text", "type": "color", "description": "Use for links in pressed state.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.500}", "light": "{color.Blue.750}" }, "resolved": { "light": "#004b85", "dark": "#49a3df" }, "aliasChain": [], "cssVariable": "--lfds-color-text-link-pressed", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3670:5941", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1930", "targetVariableName": "color/Blue/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3670:5941", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1896", "targetVariableName": "color/Blue/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.negative", "path": [ "text", "negative" ], "originalPath": [ "text", "negative" ], "group": "Color", "category": "text", "type": "color", "description": "Use to highlight negative digits.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Red.300}", "light": "{color.Red.500}" }, "resolved": { "light": "#e40523", "dark": "#f08a8a" }, "aliasChain": [], "cssVariable": "--lfds-color-text-negative", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9537:1883", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1888", "targetVariableName": "color/Red/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9537:1883", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1882", "targetVariableName": "color/Red/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-button-primary", "path": [ "text", "on-button-primary" ], "originalPath": [ "text", "on-button-primary" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on primary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-button-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3685:1359", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3685:1359", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-button-quaternary", "path": [ "text", "on-button-quaternary" ], "originalPath": [ "text", "on-button-quaternary" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on quaternary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.1000}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#001629" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-button-quaternary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:4411:1375", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1916", "targetVariableName": "color/Blue/1000", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:4411:1375", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-button-secondary", "path": [ "text", "on-button-secondary" ], "originalPath": [ "text", "on-button-secondary" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on secondary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.200}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#e3f4fc" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-button-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3076:2237", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3076:2237", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-button-tertiary", "path": [ "text", "on-button-tertiary" ], "originalPath": [ "text", "on-button-tertiary" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on tertiary buttons.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.200}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#e3f4fc" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-button-tertiary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3685:1357", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1913", "targetVariableName": "color/Blue/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3685:1357", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-img", "path": [ "text", "on-img" ], "originalPath": [ "text", "on-img" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on images.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.100}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#f5f5f5" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-img", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6206:970", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6206:970", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.on-risk", "path": [ "text", "on-risk" ], "originalPath": [ "text", "on-risk" ], "group": "Color", "category": "text", "type": "color", "description": "Use for text on risk color backgrounds.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.900}", "light": "{color.Blue.900}" }, "resolved": { "light": "#00315c", "dark": "#00315c" }, "aliasChain": [], "cssVariable": "--lfds-color-text-on-risk", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:6807:6781", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:6807:6781", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1929", "targetVariableName": "color/Blue/900", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.positive", "path": [ "text", "positive" ], "originalPath": [ "text", "positive" ], "group": "Color", "category": "text", "type": "color", "description": "Use to highlight positive digits.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-text-positive", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:9537:1882", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:9537:1882", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.primary", "path": [ "text", "primary" ], "originalPath": [ "text", "primary" ], "group": "Color", "category": "text", "type": "color", "description": "Use as default text primary color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.100}", "light": "{color.neutral.500}" }, "resolved": { "light": "#292929", "dark": "#f5f5f5" }, "aliasChain": [], "cssVariable": "--lfds-color-text-primary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14:755", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1931", "targetVariableName": "color/neutral/100", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14:755", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1921", "targetVariableName": "color/neutral/500", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.secondary", "path": [ "text", "secondary" ], "originalPath": [ "text", "secondary" ], "group": "Color", "category": "text", "type": "color", "description": "Use as default text secondary color.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.neutral.200}", "light": "{color.neutral.400}" }, "resolved": { "light": "#666666", "dark": "#d6d6d6" }, "aliasChain": [], "cssVariable": "--lfds-color-text-secondary", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:189:11372", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1928", "targetVariableName": "color/neutral/200", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:189:11372", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1904", "targetVariableName": "color/neutral/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "text.selected", "path": [ "text", "selected" ], "originalPath": [ "text", "selected" ], "group": "Color", "category": "text", "type": "color", "description": "Use as text color to highlight selected states.", "tags": [], "sourceFiles": [ "Color.dark.tokens.json", "Color.light.tokens.json" ], "modes": { "dark": "{color.Blue.400}", "light": "{color.Blue.800}" }, "resolved": { "light": "#00427a", "dark": "#76bae7" }, "aliasChain": [], "cssVariable": "--lfds-color-text-selected", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:3696:1375", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1901", "targetVariableName": "color/Blue/400", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:3696:1375", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1895", "targetVariableName": "color/Blue/800", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "alert.on-error", "path": [ "alert", "on-error" ], "originalPath": [ "alert", "on-error" ], "group": "Component", "category": "alert", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.Red.150}", "light": "{color.Red.750}" }, "resolved": { "light": "#730312", "dark": "#fbdfdf" }, "aliasChain": [], "cssVariable": "--lfds-component-alert-color-on-error", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21770:137", "com.figma.aliasData": { "targetVariableId": "VariableID:21708:139", "targetVariableName": "color/Red/150", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21770:137", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1891", "targetVariableName": "color/Red/750", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "alert.on-info", "path": [ "alert", "on-info" ], "originalPath": [ "alert", "on-info" ], "group": "Component", "category": "alert", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.Blue.250}", "light": "{color.Blue.850}" }, "resolved": { "light": "#003666", "dark": "#c0e5f8" }, "aliasChain": [], "cssVariable": "--lfds-component-alert-color-on-info", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21770:135", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1918", "targetVariableName": "color/Blue/250", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21770:135", "com.figma.aliasData": { "targetVariableId": "VariableID:21708:140", "targetVariableName": "color/Blue/850", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "alert.on-success", "path": [ "alert", "on-success" ], "originalPath": [ "alert", "on-success" ], "group": "Component", "category": "alert", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.Green.150}", "light": "{color.Green.550}" }, "resolved": { "light": "#253a21", "dark": "#c9dec4" }, "aliasChain": [], "cssVariable": "--lfds-component-alert-color-on-success", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21770:138", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1880", "targetVariableName": "color/Green/150", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21770:138", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1875", "targetVariableName": "color/Green/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "alert.on-warning", "path": [ "alert", "on-warning" ], "originalPath": [ "alert", "on-warning" ], "group": "Component", "category": "alert", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.neutral.550}", "light": "{color.neutral.550}" }, "resolved": { "light": "#0f0f0f", "dark": "#0f0f0f" }, "aliasChain": [], "cssVariable": "--lfds-component-alert-color-on-warning", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:21770:136", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1900", "targetVariableName": "color/neutral/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:21770:136", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1900", "targetVariableName": "color/neutral/550", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "icon-button.background", "path": [ "icon-button", "background" ], "originalPath": [ "icon-button", "background" ], "group": "Component", "category": "icon-button", "type": "color", "description": "Use on icon button background.", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{background.primary}", "light": "{background.primary}" }, "resolved": { "light": "#f5f5f5", "dark": "#000305" }, "aliasChain": [], "cssVariable": "--lfds-component-icon-button-color-background", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:23461:2", "com.figma.aliasData": { "targetVariableId": "VariableID:14:786", "targetVariableName": "background/primary", "targetVariableSetId": "VariableCollectionId:6:144", "targetVariableSetName": "Color" } }, "light": { "com.figma.variableId": "VariableID:23461:2", "com.figma.aliasData": { "targetVariableId": "VariableID:14:786", "targetVariableName": "background/primary", "targetVariableSetId": "VariableCollectionId:6:144", "targetVariableSetName": "Color" } } } } }, { "id": "toggle.background-on", "path": [ "toggle", "background-on" ], "originalPath": [ "toggle", "background-on" ], "group": "Component", "category": "toggle", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.Blue.600}", "light": "{color.Blue.700}" }, "resolved": { "light": "#005aa0", "dark": "#1f74ad" }, "aliasChain": [], "cssVariable": "--lfds-component-toggle-color-background-on", "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14494:1181", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14494:1181", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1887", "targetVariableName": "color/Blue/700", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "toggle.foreground-off-android", "path": [ "toggle", "foreground-off-android" ], "originalPath": [ "toggle", "foreground-off-android" ], "group": "Component", "category": "toggle", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.Blue.600}", "light": "{color.neutral.300}" }, "resolved": { "light": "#7a7a7a", "dark": "#1f74ad" }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14478:1306", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1903", "targetVariableName": "color/Blue/600", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14478:1306", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1906", "targetVariableName": "color/neutral/300", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "toggle.foreground-on-android", "path": [ "toggle", "foreground-on-android" ], "originalPath": [ "toggle", "foreground-on-android" ], "group": "Component", "category": "toggle", "type": "color", "tags": [], "sourceFiles": [ "Component.dark.tokens.json", "Component.light.tokens.json" ], "modes": { "dark": "{color.neutral.0}", "light": "{color.neutral.0}" }, "resolved": { "light": "#ffffff", "dark": "#ffffff" }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": true, "isPrimitive": false }, "metadata": { "extensions": { "dark": { "com.figma.variableId": "VariableID:14478:1307", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "light": { "com.figma.variableId": "VariableID:14478:1307", "com.figma.aliasData": { "targetVariableId": "VariableID:14529:1917", "targetVariableName": "color/neutral/0", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "border.radius.12", "path": [ "border", "radius", "12" ], "originalPath": [ "border", "radius", "12" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "12px" }, "resolved": { "base": "12px" }, "aliasChain": "12px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13181:531" } } } }, { "id": "border.radius.16", "path": [ "border", "radius", "16" ], "originalPath": [ "border", "radius", "16" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "16px" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:927" } } } }, { "id": "border.radius.2", "path": [ "border", "radius", "2" ], "originalPath": [ "border", "radius", "2" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "2px" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13058:5852" } } } }, { "id": "border.radius.4", "path": [ "border", "radius", "4" ], "originalPath": [ "border", "radius", "4" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "4px" }, "resolved": { "base": "4px" }, "aliasChain": "4px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:925" } } } }, { "id": "border.radius.8", "path": [ "border", "radius", "8" ], "originalPath": [ "border", "radius", "8" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "8px" }, "resolved": { "base": "8px" }, "aliasChain": "8px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:926" } } } }, { "id": "border.radius.max", "path": [ "border", "radius", "max" ], "originalPath": [ "border", "radius", "max" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "100000px" }, "resolved": { "base": "100000px" }, "aliasChain": "100000px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:928" } } } }, { "id": "border.width.1", "path": [ "border", "width", "1" ], "originalPath": [ "border", "width", "1" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "1px" }, "resolved": { "base": "1px" }, "aliasChain": "1px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:941" } } } }, { "id": "border.width.2", "path": [ "border", "width", "2" ], "originalPath": [ "border", "width", "2" ], "group": "Primitive", "category": "border", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "2px" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:942" } } } }, { "id": "color.Blue.100", "path": [ "color", "Blue", "100" ], "originalPath": [ "color", "Blue", "100" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#f6fbfe" }, "resolved": { "base": "#f6fbfe" }, "aliasChain": "#f6fbfe", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1889" } } } }, { "id": "color.Blue.1000", "path": [ "color", "Blue", "1000" ], "originalPath": [ "color", "Blue", "1000" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#001629" }, "resolved": { "base": "#001629" }, "aliasChain": "#001629", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1916" } } } }, { "id": "color.Blue.1050", "path": [ "color", "Blue", "1050" ], "originalPath": [ "color", "Blue", "1050" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#000305" }, "resolved": { "base": "#000305" }, "aliasChain": "#000305", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1897" } } } }, { "id": "color.Blue.200", "path": [ "color", "Blue", "200" ], "originalPath": [ "color", "Blue", "200" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#e3f4fc" }, "resolved": { "base": "#e3f4fc" }, "aliasChain": "#e3f4fc", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1913" } } } }, { "id": "color.Blue.250", "path": [ "color", "Blue", "250" ], "originalPath": [ "color", "Blue", "250" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#c0e5f8" }, "resolved": { "base": "#c0e5f8" }, "aliasChain": "#c0e5f8", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1918" } } } }, { "id": "color.Blue.300", "path": [ "color", "Blue", "300" ], "originalPath": [ "color", "Blue", "300" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#b6e1f7" }, "resolved": { "base": "#b6e1f7" }, "aliasChain": "#b6e1f7", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1919" } } } }, { "id": "color.Blue.350", "path": [ "color", "Blue", "350" ], "originalPath": [ "color", "Blue", "350" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#91d2f3" }, "resolved": { "base": "#91d2f3" }, "aliasChain": "#91d2f3", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1910" } } } }, { "id": "color.Blue.400", "path": [ "color", "Blue", "400" ], "originalPath": [ "color", "Blue", "400" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#76bae7" }, "resolved": { "base": "#76bae7" }, "aliasChain": "#76bae7", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1901" } } } }, { "id": "color.Blue.450", "path": [ "color", "Blue", "450" ], "originalPath": [ "color", "Blue", "450" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#52a8e1" }, "resolved": { "base": "#52a8e1" }, "aliasChain": "#52a8e1", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1907" } } } }, { "id": "color.Blue.500", "path": [ "color", "Blue", "500" ], "originalPath": [ "color", "Blue", "500" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#49a3df" }, "resolved": { "base": "#49a3df" }, "aliasChain": "#49a3df", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1930" } } } }, { "id": "color.Blue.550", "path": [ "color", "Blue", "550" ], "originalPath": [ "color", "Blue", "550" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#2792d8" }, "resolved": { "base": "#2792d8" }, "aliasChain": "#2792d8", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1915" } } } }, { "id": "color.Blue.600", "path": [ "color", "Blue", "600" ], "originalPath": [ "color", "Blue", "600" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#1f74ad" }, "resolved": { "base": "#1f74ad" }, "aliasChain": "#1f74ad", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1903" } } } }, { "id": "color.Blue.650", "path": [ "color", "Blue", "650" ], "originalPath": [ "color", "Blue", "650" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#185c8b" }, "resolved": { "base": "#185c8b" }, "aliasChain": "#185c8b", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1899" } } } }, { "id": "color.Blue.700", "path": [ "color", "Blue", "700" ], "originalPath": [ "color", "Blue", "700" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#005aa0" }, "resolved": { "base": "#005aa0" }, "aliasChain": "#005aa0", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1887" } } } }, { "id": "color.Blue.750", "path": [ "color", "Blue", "750" ], "originalPath": [ "color", "Blue", "750" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#004b85" }, "resolved": { "base": "#004b85" }, "aliasChain": "#004b85", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1896" } } } }, { "id": "color.Blue.800", "path": [ "color", "Blue", "800" ], "originalPath": [ "color", "Blue", "800" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#00427a" }, "resolved": { "base": "#00427a" }, "aliasChain": "#00427a", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1895" } } } }, { "id": "color.Blue.850", "path": [ "color", "Blue", "850" ], "originalPath": [ "color", "Blue", "850" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#003666" }, "resolved": { "base": "#003666" }, "aliasChain": "#003666", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:21708:140" } } } }, { "id": "color.Blue.900", "path": [ "color", "Blue", "900" ], "originalPath": [ "color", "Blue", "900" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#00315c" }, "resolved": { "base": "#00315c" }, "aliasChain": "#00315c", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1929" } } } }, { "id": "color.Blue.950", "path": [ "color", "Blue", "950" ], "originalPath": [ "color", "Blue", "950" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#001b33" }, "resolved": { "base": "#001b33" }, "aliasChain": "#001b33", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1893" } } } }, { "id": "color.Green.100", "path": [ "color", "Green", "100" ], "originalPath": [ "color", "Green", "100" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#e1edde" }, "resolved": { "base": "#e1edde" }, "aliasChain": "#e1edde", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1894" } } } }, { "id": "color.Green.150", "path": [ "color", "Green", "150" ], "originalPath": [ "color", "Green", "150" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#c9dec4" }, "resolved": { "base": "#c9dec4" }, "aliasChain": "#c9dec4", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1880" } } } }, { "id": "color.Green.200", "path": [ "color", "Green", "200" ], "originalPath": [ "color", "Green", "200" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#abcca4" }, "resolved": { "base": "#abcca4" }, "aliasChain": "#abcca4", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1879" } } } }, { "id": "color.Green.250", "path": [ "color", "Green", "250" ], "originalPath": [ "color", "Green", "250" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#92bd89" }, "resolved": { "base": "#92bd89" }, "aliasChain": "#92bd89", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1909" } } } }, { "id": "color.Green.300", "path": [ "color", "Green", "300" ], "originalPath": [ "color", "Green", "300" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#86b67c" }, "resolved": { "base": "#86b67c" }, "aliasChain": "#86b67c", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1886" } } } }, { "id": "color.Green.350", "path": [ "color", "Green", "350" ], "originalPath": [ "color", "Green", "350" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#6ea762" }, "resolved": { "base": "#6ea762" }, "aliasChain": "#6ea762", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1878" } } } }, { "id": "color.Green.400", "path": [ "color", "Green", "400" ], "originalPath": [ "color", "Green", "400" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#6ea762" }, "resolved": { "base": "#6ea762" }, "aliasChain": "#6ea762", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1877" } } } }, { "id": "color.Green.450", "path": [ "color", "Green", "450" ], "originalPath": [ "color", "Green", "450" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#5f9654" }, "resolved": { "base": "#5f9654" }, "aliasChain": "#5f9654", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1905" } } } }, { "id": "color.Green.500", "path": [ "color", "Green", "500" ], "originalPath": [ "color", "Green", "500" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#3e6237" }, "resolved": { "base": "#3e6237" }, "aliasChain": "#3e6237", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1876" } } } }, { "id": "color.Green.550", "path": [ "color", "Green", "550" ], "originalPath": [ "color", "Green", "550" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#253a21" }, "resolved": { "base": "#253a21" }, "aliasChain": "#253a21", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1875" } } } }, { "id": "color.magenta.500", "path": [ "color", "magenta", "500" ], "originalPath": [ "color", "magenta", "500" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#c900bc" }, "resolved": { "base": "#c900bc" }, "aliasChain": "#c900bc", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:22558:136" } } } }, { "id": "color.neutral.0", "path": [ "color", "neutral", "0" ], "originalPath": [ "color", "neutral", "0" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ffffff" }, "resolved": { "base": "#ffffff" }, "aliasChain": "#ffffff", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1917" } } } }, { "id": "color.neutral.100", "path": [ "color", "neutral", "100" ], "originalPath": [ "color", "neutral", "100" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#f5f5f5" }, "resolved": { "base": "#f5f5f5" }, "aliasChain": "#f5f5f5", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1931" } } } }, { "id": "color.neutral.150", "path": [ "color", "neutral", "150" ], "originalPath": [ "color", "neutral", "150" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#e6e6e6" }, "resolved": { "base": "#e6e6e6" }, "aliasChain": "#e6e6e6", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1927" } } } }, { "id": "color.neutral.200", "path": [ "color", "neutral", "200" ], "originalPath": [ "color", "neutral", "200" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#d6d6d6" }, "resolved": { "base": "#d6d6d6" }, "aliasChain": "#d6d6d6", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1928" } } } }, { "id": "color.neutral.250", "path": [ "color", "neutral", "250" ], "originalPath": [ "color", "neutral", "250" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#c2c2c2" }, "resolved": { "base": "#c2c2c2" }, "aliasChain": "#c2c2c2", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1911" } } } }, { "id": "color.neutral.300", "path": [ "color", "neutral", "300" ], "originalPath": [ "color", "neutral", "300" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#7a7a7a" }, "resolved": { "base": "#7a7a7a" }, "aliasChain": "#7a7a7a", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1906" } } } }, { "id": "color.neutral.350", "path": [ "color", "neutral", "350" ], "originalPath": [ "color", "neutral", "350" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#626262" }, "resolved": { "base": "#626262" }, "aliasChain": "#626262", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1912" } } } }, { "id": "color.neutral.400", "path": [ "color", "neutral", "400" ], "originalPath": [ "color", "neutral", "400" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#666666" }, "resolved": { "base": "#666666" }, "aliasChain": "#666666", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1904" } } } }, { "id": "color.neutral.450", "path": [ "color", "neutral", "450" ], "originalPath": [ "color", "neutral", "450" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#4d4d4d" }, "resolved": { "base": "#4d4d4d" }, "aliasChain": "#4d4d4d", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1925" } } } }, { "id": "color.neutral.50", "path": [ "color", "neutral", "50" ], "originalPath": [ "color", "neutral", "50" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#fafafa" }, "resolved": { "base": "#fafafa" }, "aliasChain": "#fafafa", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1920" } } } }, { "id": "color.neutral.500", "path": [ "color", "neutral", "500" ], "originalPath": [ "color", "neutral", "500" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#292929" }, "resolved": { "base": "#292929" }, "aliasChain": "#292929", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1921" } } } }, { "id": "color.neutral.550", "path": [ "color", "neutral", "550" ], "originalPath": [ "color", "neutral", "550" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#0f0f0f" }, "resolved": { "base": "#0f0f0f" }, "aliasChain": "#0f0f0f", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1900" } } } }, { "id": "color.Red.100", "path": [ "color", "Red", "100" ], "originalPath": [ "color", "Red", "100" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#fdeded" }, "resolved": { "base": "#fdeded" }, "aliasChain": "#fdeded", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1890" } } } }, { "id": "color.Red.150", "path": [ "color", "Red", "150" ], "originalPath": [ "color", "Red", "150" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#fbdfdf" }, "resolved": { "base": "#fbdfdf" }, "aliasChain": "#fbdfdf", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:21708:139" } } } }, { "id": "color.Red.200", "path": [ "color", "Red", "200" ], "originalPath": [ "color", "Red", "200" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#f9d2d2" }, "resolved": { "base": "#f9d2d2" }, "aliasChain": "#f9d2d2", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1884" } } } }, { "id": "color.Red.250", "path": [ "color", "Red", "250" ], "originalPath": [ "color", "Red", "250" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#f7bdbd" }, "resolved": { "base": "#f7bdbd" }, "aliasChain": "#f7bdbd", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1914" } } } }, { "id": "color.Red.300", "path": [ "color", "Red", "300" ], "originalPath": [ "color", "Red", "300" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#f08a8a" }, "resolved": { "base": "#f08a8a" }, "aliasChain": "#f08a8a", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1888" } } } }, { "id": "color.Red.350", "path": [ "color", "Red", "350" ], "originalPath": [ "color", "Red", "350" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ee7979" }, "resolved": { "base": "#ee7979" }, "aliasChain": "#ee7979", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1902" } } } }, { "id": "color.Red.400", "path": [ "color", "Red", "400" ], "originalPath": [ "color", "Red", "400" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#eb5c5c" }, "resolved": { "base": "#eb5c5c" }, "aliasChain": "#eb5c5c", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1885" } } } }, { "id": "color.Red.450", "path": [ "color", "Red", "450" ], "originalPath": [ "color", "Red", "450" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#e74040" }, "resolved": { "base": "#e74040" }, "aliasChain": "#e74040", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1926" } } } }, { "id": "color.Red.500", "path": [ "color", "Red", "500" ], "originalPath": [ "color", "Red", "500" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#e40523" }, "resolved": { "base": "#e40523" }, "aliasChain": "#e40523", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1882" } } } }, { "id": "color.Red.600", "path": [ "color", "Red", "600" ], "originalPath": [ "color", "Red", "600" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#c8041e" }, "resolved": { "base": "#c8041e" }, "aliasChain": "#c8041e", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1881" } } } }, { "id": "color.Red.650", "path": [ "color", "Red", "650" ], "originalPath": [ "color", "Red", "650" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#b4041b" }, "resolved": { "base": "#b4041b" }, "aliasChain": "#b4041b", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1898" } } } }, { "id": "color.Red.700", "path": [ "color", "Red", "700" ], "originalPath": [ "color", "Red", "700" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#870315" }, "resolved": { "base": "#870315" }, "aliasChain": "#870315", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1923" } } } }, { "id": "color.Red.750", "path": [ "color", "Red", "750" ], "originalPath": [ "color", "Red", "750" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#730312" }, "resolved": { "base": "#730312" }, "aliasChain": "#730312", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1891" } } } }, { "id": "color.transparent.blue-1000-a0", "path": [ "color", "transparent", "blue-1000-a0" ], "originalPath": [ "color", "transparent", "blue-1000-a0" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#00162900" }, "resolved": { "base": "#00162900" }, "aliasChain": "#00162900", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1869" } } } }, { "id": "color.transparent.blue-900-a75", "path": [ "color", "transparent", "blue-900-a75" ], "originalPath": [ "color", "transparent", "blue-900-a75" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#00315cbf" }, "resolved": { "base": "#00315cbf" }, "aliasChain": "#00315cbf", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1883" } } } }, { "id": "color.transparent.neutral-0-a0", "path": [ "color", "transparent", "neutral-0-a0" ], "originalPath": [ "color", "transparent", "neutral-0-a0" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ffffff00" }, "resolved": { "base": "#ffffff00" }, "aliasChain": "#ffffff00", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1870" } } } }, { "id": "color.Yellow.100", "path": [ "color", "Yellow", "100" ], "originalPath": [ "color", "Yellow", "100" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#fff5cc" }, "resolved": { "base": "#fff5cc" }, "aliasChain": "#fff5cc", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1922" } } } }, { "id": "color.Yellow.150", "path": [ "color", "Yellow", "150" ], "originalPath": [ "color", "Yellow", "150" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#fff0b8" }, "resolved": { "base": "#fff0b8" }, "aliasChain": "#fff0b8", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1873" } } } }, { "id": "color.Yellow.200", "path": [ "color", "Yellow", "200" ], "originalPath": [ "color", "Yellow", "200" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ffe680" }, "resolved": { "base": "#ffe680" }, "aliasChain": "#ffe680", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1872" } } } }, { "id": "color.Yellow.250", "path": [ "color", "Yellow", "250" ], "originalPath": [ "color", "Yellow", "250" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ffda42" }, "resolved": { "base": "#ffda42" }, "aliasChain": "#ffda42", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1871" } } } }, { "id": "color.Yellow.300", "path": [ "color", "Yellow", "300" ], "originalPath": [ "color", "Yellow", "300" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ffd114" }, "resolved": { "base": "#ffd114" }, "aliasChain": "#ffd114", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1892" } } } }, { "id": "color.Yellow.350", "path": [ "color", "Yellow", "350" ], "originalPath": [ "color", "Yellow", "350" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#ebbd00" }, "resolved": { "base": "#ebbd00" }, "aliasChain": "#ebbd00", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1874" } } } }, { "id": "color.Yellow.400", "path": [ "color", "Yellow", "400" ], "originalPath": [ "color", "Yellow", "400" ], "group": "Primitive", "category": "color", "type": "color", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "#d4b102" }, "resolved": { "base": "#d4b102" }, "aliasChain": "#d4b102", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14529:1908" } } } }, { "id": "size.48", "path": [ "size", "48" ], "originalPath": [ "size", "48" ], "group": "Primitive", "category": "size", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "48px" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:853" } } } }, { "id": "size.56", "path": [ "size", "56" ], "originalPath": [ "size", "56" ], "group": "Primitive", "category": "size", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "56px" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:854" } } } }, { "id": "size.64", "path": [ "size", "64" ], "originalPath": [ "size", "64" ], "group": "Primitive", "category": "size", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "64px" }, "resolved": { "base": "64px" }, "aliasChain": "64px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:938" } } } }, { "id": "spacing.12", "path": [ "spacing", "12" ], "originalPath": [ "spacing", "12" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "12px" }, "resolved": { "base": "12px" }, "aliasChain": "12px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13012:1200" } } } }, { "id": "spacing.16", "path": [ "spacing", "16" ], "originalPath": [ "spacing", "16" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "16px" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:670" } } } }, { "id": "spacing.2", "path": [ "spacing", "2" ], "originalPath": [ "spacing", "2" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "2px" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13088:1125" } } } }, { "id": "spacing.24", "path": [ "spacing", "24" ], "originalPath": [ "spacing", "24" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "24px" }, "resolved": { "base": "24px" }, "aliasChain": "24px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:671" } } } }, { "id": "spacing.32", "path": [ "spacing", "32" ], "originalPath": [ "spacing", "32" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "32px" }, "resolved": { "base": "32px" }, "aliasChain": "32px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:672" } } } }, { "id": "spacing.4", "path": [ "spacing", "4" ], "originalPath": [ "spacing", "4" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "4px" }, "resolved": { "base": "4px" }, "aliasChain": "4px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:668" } } } }, { "id": "spacing.40", "path": [ "spacing", "40" ], "originalPath": [ "spacing", "40" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "40px" }, "resolved": { "base": "40px" }, "aliasChain": "40px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:934" } } } }, { "id": "spacing.48", "path": [ "spacing", "48" ], "originalPath": [ "spacing", "48" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "48px" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:673" } } } }, { "id": "spacing.56", "path": [ "spacing", "56" ], "originalPath": [ "spacing", "56" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "56px" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13019:935" } } } }, { "id": "spacing.64", "path": [ "spacing", "64" ], "originalPath": [ "spacing", "64" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "64px" }, "resolved": { "base": "64px" }, "aliasChain": "64px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:674" } } } }, { "id": "spacing.72", "path": [ "spacing", "72" ], "originalPath": [ "spacing", "72" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "72px" }, "resolved": { "base": "72px" }, "aliasChain": "72px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:140" } } } }, { "id": "spacing.8", "path": [ "spacing", "8" ], "originalPath": [ "spacing", "8" ], "group": "Primitive", "category": "spacing", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "8px" }, "resolved": { "base": "8px" }, "aliasChain": "8px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:12990:669" } } } }, { "id": "typography.font-family.brand", "path": [ "typography", "font-family", "brand" ], "originalPath": [ "typography", "font-family", "brand" ], "group": "Primitive", "category": "typography", "type": "string", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "LF Rubrik" }, "resolved": { "base": "LF Rubrik" }, "aliasChain": "LF Rubrik", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:8075:329" } } } }, { "id": "typography.font-family.ui", "path": [ "typography", "font-family", "ui" ], "originalPath": [ "typography", "font-family", "ui" ], "group": "Primitive", "category": "typography", "type": "string", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "IBM Plex Sans" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:8075:333" } } } }, { "id": "typography.font-size.12", "path": [ "typography", "font-size", "12" ], "originalPath": [ "typography", "font-size", "12" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "12px" }, "resolved": { "base": "12px" }, "aliasChain": "12px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18029" } } } }, { "id": "typography.font-size.14", "path": [ "typography", "font-size", "14" ], "originalPath": [ "typography", "font-size", "14" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "14px" }, "resolved": { "base": "14px" }, "aliasChain": "14px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18052" } } } }, { "id": "typography.font-size.16", "path": [ "typography", "font-size", "16" ], "originalPath": [ "typography", "font-size", "16" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "16px" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18021" } } } }, { "id": "typography.font-size.18", "path": [ "typography", "font-size", "18" ], "originalPath": [ "typography", "font-size", "18" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "18px" }, "resolved": { "base": "18px" }, "aliasChain": "18px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18042" } } } }, { "id": "typography.font-size.20", "path": [ "typography", "font-size", "20" ], "originalPath": [ "typography", "font-size", "20" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "20px" }, "resolved": { "base": "20px" }, "aliasChain": "20px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18022" } } } }, { "id": "typography.font-size.24", "path": [ "typography", "font-size", "24" ], "originalPath": [ "typography", "font-size", "24" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "24px" }, "resolved": { "base": "24px" }, "aliasChain": "24px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18045" } } } }, { "id": "typography.font-size.28", "path": [ "typography", "font-size", "28" ], "originalPath": [ "typography", "font-size", "28" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "28px" }, "resolved": { "base": "28px" }, "aliasChain": "28px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18054" } } } }, { "id": "typography.font-size.30", "path": [ "typography", "font-size", "30" ], "originalPath": [ "typography", "font-size", "30" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "30px" }, "resolved": { "base": "30px" }, "aliasChain": "30px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18053" } } } }, { "id": "typography.font-size.32", "path": [ "typography", "font-size", "32" ], "originalPath": [ "typography", "font-size", "32" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "32px" }, "resolved": { "base": "32px" }, "aliasChain": "32px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18046" } } } }, { "id": "typography.font-size.36", "path": [ "typography", "font-size", "36" ], "originalPath": [ "typography", "font-size", "36" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "36px" }, "resolved": { "base": "36px" }, "aliasChain": "36px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18051" } } } }, { "id": "typography.font-size.40", "path": [ "typography", "font-size", "40" ], "originalPath": [ "typography", "font-size", "40" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "40px" }, "resolved": { "base": "40px" }, "aliasChain": "40px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18039" } } } }, { "id": "typography.font-size.48", "path": [ "typography", "font-size", "48" ], "originalPath": [ "typography", "font-size", "48" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "48px" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18050" } } } }, { "id": "typography.font-size.56", "path": [ "typography", "font-size", "56" ], "originalPath": [ "typography", "font-size", "56" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "56px" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18040" } } } }, { "id": "typography.font-style.italic", "path": [ "typography", "font-style", "italic" ], "originalPath": [ "typography", "font-style", "italic" ], "group": "Primitive", "category": "typography", "type": "string", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "italic" }, "resolved": { "base": "italic" }, "aliasChain": "italic", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:8199:9598" } } } }, { "id": "typography.font-weight.bold", "path": [ "typography", "font-weight", "bold" ], "originalPath": [ "typography", "font-weight", "bold" ], "group": "Primitive", "category": "typography", "type": "number", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": 700 }, "resolved": { "base": 700 }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:172" } } } }, { "id": "typography.font-weight.medium", "path": [ "typography", "font-weight", "medium" ], "originalPath": [ "typography", "font-weight", "medium" ], "group": "Primitive", "category": "typography", "type": "number", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": 500 }, "resolved": { "base": 500 }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:170" } } } }, { "id": "typography.font-weight.regular", "path": [ "typography", "font-weight", "regular" ], "originalPath": [ "typography", "font-weight", "regular" ], "group": "Primitive", "category": "typography", "type": "number", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": 400 }, "resolved": { "base": 400 }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:169" } } } }, { "id": "typography.font-weight.semibold", "path": [ "typography", "font-weight", "semibold" ], "originalPath": [ "typography", "font-weight", "semibold" ], "group": "Primitive", "category": "typography", "type": "number", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": 600 }, "resolved": { "base": 600 }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:171" } } } }, { "id": "typography.line-height.18", "path": [ "typography", "line-height", "18" ], "originalPath": [ "typography", "line-height", "18" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "18px" }, "resolved": { "base": "18px" }, "aliasChain": "18px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18035" } } } }, { "id": "typography.line-height.20", "path": [ "typography", "line-height", "20" ], "originalPath": [ "typography", "line-height", "20" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "20px" }, "resolved": { "base": "20px" }, "aliasChain": "20px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18041" } } } }, { "id": "typography.line-height.24", "path": [ "typography", "line-height", "24" ], "originalPath": [ "typography", "line-height", "24" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "24px" }, "resolved": { "base": "24px" }, "aliasChain": "24px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18034" } } } }, { "id": "typography.line-height.28", "path": [ "typography", "line-height", "28" ], "originalPath": [ "typography", "line-height", "28" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "28px" }, "resolved": { "base": "28px" }, "aliasChain": "28px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18031" } } } }, { "id": "typography.line-height.32", "path": [ "typography", "line-height", "32" ], "originalPath": [ "typography", "line-height", "32" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "32px" }, "resolved": { "base": "32px" }, "aliasChain": "32px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18028" } } } }, { "id": "typography.line-height.36", "path": [ "typography", "line-height", "36" ], "originalPath": [ "typography", "line-height", "36" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "36px" }, "resolved": { "base": "36px" }, "aliasChain": "36px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18027" } } } }, { "id": "typography.line-height.40", "path": [ "typography", "line-height", "40" ], "originalPath": [ "typography", "line-height", "40" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "40px" }, "resolved": { "base": "40px" }, "aliasChain": "40px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18026" } } } }, { "id": "typography.line-height.48", "path": [ "typography", "line-height", "48" ], "originalPath": [ "typography", "line-height", "48" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "48px" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13113:18047" } } } }, { "id": "typography.line-height.52", "path": [ "typography", "line-height", "52" ], "originalPath": [ "typography", "line-height", "52" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "52px" }, "resolved": { "base": "52px" }, "aliasChain": "52px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:13979:19483" } } } }, { "id": "typography.line-height.56", "path": [ "typography", "line-height", "56" ], "originalPath": [ "typography", "line-height", "56" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "56px" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14084:19514" } } } }, { "id": "typography.line-height.64", "path": [ "typography", "line-height", "64" ], "originalPath": [ "typography", "line-height", "64" ], "group": "Primitive", "category": "typography", "type": "dimension", "tags": [], "sourceFiles": [ "Primitives.tokens.json" ], "modes": { "base": "64px" }, "resolved": { "base": "64px" }, "aliasChain": "64px", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": true }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:14458:20123" } } } }, { "id": "control.default", "path": [ "control", "default" ], "originalPath": [ "control", "default" ], "group": "Size", "category": "Control", "type": "dimension", "description": "Use as min-height on interactive elements to ensure compliant target area/size.", "tags": [], "sourceFiles": [ "Size.tokens.json" ], "modes": { "base": "{size.56}" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": "--lfds-size-control-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19437:224", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:854", "targetVariableName": "size/56", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "control.lg", "path": [ "control", "lg" ], "originalPath": [ "control", "lg" ], "group": "Size", "category": "Control", "type": "dimension", "description": "Use as min-height on interactive elements to ensure compliant target area/size.", "tags": [], "sourceFiles": [ "Size.tokens.json" ], "modes": { "base": "{size.64}" }, "resolved": { "base": "64px" }, "aliasChain": "64px", "cssVariable": "--lfds-size-control-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20282:261", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:938", "targetVariableName": "size/64", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "control.sm", "path": [ "control", "sm" ], "originalPath": [ "control", "sm" ], "group": "Size", "category": "Control", "type": "dimension", "description": "Use as min-height on interactive elements to ensure compliant target area/size. Sm size is the smallest acccepted size for clickable components.", "tags": [], "sourceFiles": [ "Size.tokens.json" ], "modes": { "base": "{size.48}" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": "--lfds-size-control-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19437:217", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:853", "targetVariableName": "size/48", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "2xl", "path": [ "2xl" ], "originalPath": [ "2xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "2xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.32}" }, "resolved": { "base": "32px" }, "aliasChain": "32px", "cssVariable": "--lfds-spacing-2xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:293", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:672", "targetVariableName": "spacing/32", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "2xs", "path": [ "2xs" ], "originalPath": [ "2xs" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "2xs spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.2}" }, "resolved": { "base": "2px" }, "aliasChain": "2px", "cssVariable": "--lfds-spacing-2xs", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:300", "com.figma.aliasData": { "targetVariableId": "VariableID:13088:1125", "targetVariableName": "spacing/2", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "3xl", "path": [ "3xl" ], "originalPath": [ "3xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "3xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.40}" }, "resolved": { "base": "40px" }, "aliasChain": "40px", "cssVariable": "--lfds-spacing-3xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:299", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:934", "targetVariableName": "spacing/40", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "4xl", "path": [ "4xl" ], "originalPath": [ "4xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "4xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.48}" }, "resolved": { "base": "48px" }, "aliasChain": "48px", "cssVariable": "--lfds-spacing-4xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:297", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:673", "targetVariableName": "spacing/48", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "5xl", "path": [ "5xl" ], "originalPath": [ "5xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "5xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.56}" }, "resolved": { "base": "56px" }, "aliasChain": "56px", "cssVariable": "--lfds-spacing-5xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:296", "com.figma.aliasData": { "targetVariableId": "VariableID:13019:935", "targetVariableName": "spacing/56", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "6xl", "path": [ "6xl" ], "originalPath": [ "6xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "6xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.64}" }, "resolved": { "base": "64px" }, "aliasChain": "64px", "cssVariable": "--lfds-spacing-6xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:292", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:674", "targetVariableName": "spacing/64", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "7xl", "path": [ "7xl" ], "originalPath": [ "7xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "7xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.72}" }, "resolved": { "base": "72px" }, "aliasChain": "72px", "cssVariable": "--lfds-spacing-7xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:301", "com.figma.aliasData": { "targetVariableId": "VariableID:19211:140", "targetVariableName": "spacing/72", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "lg", "path": [ "lg" ], "originalPath": [ "lg" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "Lg spacing. Default spacing on mobile.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.16}" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": "--lfds-spacing-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:298", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:670", "targetVariableName": "spacing/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "md", "path": [ "md" ], "originalPath": [ "md" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "Md spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.12}" }, "resolved": { "base": "12px" }, "aliasChain": "12px", "cssVariable": "--lfds-spacing-md", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:294", "com.figma.aliasData": { "targetVariableId": "VariableID:13012:1200", "targetVariableName": "spacing/12", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "sm", "path": [ "sm" ], "originalPath": [ "sm" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "Sm spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.8}" }, "resolved": { "base": "8px" }, "aliasChain": "8px", "cssVariable": "--lfds-spacing-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:303", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:669", "targetVariableName": "spacing/8", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "xl", "path": [ "xl" ], "originalPath": [ "xl" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "Xl spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.24}" }, "resolved": { "base": "24px" }, "aliasChain": "24px", "cssVariable": "--lfds-spacing-xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:295", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:671", "targetVariableName": "spacing/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "xs", "path": [ "xs" ], "originalPath": [ "xs" ], "group": "Spacing", "category": "Scale", "type": "dimension", "description": "Xs spacing.", "tags": [], "sourceFiles": [ "Spacing.tokens.json" ], "modes": { "base": "{spacing.4}" }, "resolved": { "base": "4px" }, "aliasChain": "4px", "cssVariable": "--lfds-spacing-xs", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:20179:302", "com.figma.aliasData": { "targetVariableId": "VariableID:12990:668", "targetVariableName": "spacing/4", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "typography.body.default", "path": [ "body", "default" ], "originalPath": [ "typography", "body", "default" ], "group": "Typography", "category": "body", "subCategory": "default", "type": "typography", "description": "Typography style body default", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.body}", "fontWeight": "{font-weight.regular}", "fontSize": "{body.default.font-size}", "lineHeight": "{body.default.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.body.lg", "path": [ "body", "lg" ], "originalPath": [ "typography", "body", "lg" ], "group": "Typography", "category": "body", "subCategory": "lg", "type": "typography", "description": "Typography style body lg", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.body}", "fontWeight": "{font-weight.regular}", "fontSize": "{body.lg.font-size}", "lineHeight": "{body.lg.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.body.sm", "path": [ "body", "sm" ], "originalPath": [ "typography", "body", "sm" ], "group": "Typography", "category": "body", "subCategory": "sm", "type": "typography", "description": "Typography style body sm", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.body}", "fontWeight": "{font-weight.regular}", "fontSize": "{body.sm.font-size}", "lineHeight": "{body.sm.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.caption.default", "path": [ "caption", "default" ], "originalPath": [ "typography", "caption", "default" ], "group": "Typography", "category": "caption", "subCategory": "default", "type": "typography", "description": "Typography style caption default", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.caption}", "fontWeight": "{font-weight.regular}", "fontSize": "{caption.default.font-size}", "lineHeight": "{caption.default.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.display.default", "path": [ "display", "default" ], "originalPath": [ "typography", "display", "default" ], "group": "Typography", "category": "display", "subCategory": "default", "type": "typography", "description": "Typography style display default", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.display}", "fontWeight": "{font-weight.regular}", "fontSize": "{display.default.font-size}", "lineHeight": "{display.default.line-height}" } }, "resolved": { "base": { "fontFamily": "LF Rubrik", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "font-family.body", "path": [ "font-family", "body" ], "originalPath": [ "font-family", "body" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.ui}" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": "--lfds-font-family-body", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:161", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:333", "targetVariableName": "typography/font-family/ui", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-family.caption", "path": [ "font-family", "caption" ], "originalPath": [ "font-family", "caption" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.ui}" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": "--lfds-font-family-caption", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:163", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:333", "targetVariableName": "typography/font-family/ui", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-family.display", "path": [ "font-family", "display" ], "originalPath": [ "font-family", "display" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.brand}" }, "resolved": { "base": "LF Rubrik" }, "aliasChain": "LF Rubrik", "cssVariable": "--lfds-font-family-display", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:159", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:329", "targetVariableName": "typography/font-family/brand", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-family.heading", "path": [ "font-family", "heading" ], "originalPath": [ "font-family", "heading" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.ui}" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": "--lfds-font-family-heading", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:160", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:333", "targetVariableName": "typography/font-family/ui", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-family.label", "path": [ "font-family", "label" ], "originalPath": [ "font-family", "label" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.ui}" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": "--lfds-font-family-label", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:162", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:333", "targetVariableName": "typography/font-family/ui", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-family.value", "path": [ "font-family", "value" ], "originalPath": [ "font-family", "value" ], "group": "Typography", "category": "font-family", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-family.ui}" }, "resolved": { "base": "IBM Plex Sans" }, "aliasChain": "IBM Plex Sans", "cssVariable": "--lfds-font-family-value", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:164", "com.figma.aliasData": { "targetVariableId": "VariableID:8075:333", "targetVariableName": "typography/font-family/ui", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "body.default.font-size", "path": [ "body", "default", "font-size" ], "originalPath": [ "body", "default", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.16}", "min": "{typography.font-size.16}" }, "resolved": { "min": "1rem", "max": "1rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-body-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19293:55", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19293:55", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "body.lg.font-size", "path": [ "body", "lg", "font-size" ], "originalPath": [ "body", "lg", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.20}", "min": "{typography.font-size.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-body-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19706:1920", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18022", "targetVariableName": "typography/font-size/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19706:1920", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18022", "targetVariableName": "typography/font-size/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "body.sm.font-size", "path": [ "body", "sm", "font-size" ], "originalPath": [ "body", "sm", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.14}", "min": "{typography.font-size.14}" }, "resolved": { "min": "0.875rem", "max": "0.875rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-body-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19293:58", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19293:58", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "caption.default.font-size", "path": [ "caption", "default", "font-size" ], "originalPath": [ "caption", "default", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "caption", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.14}", "min": "{typography.font-size.14}" }, "resolved": { "min": "0.875rem", "max": "0.875rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-caption-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:104", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:104", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "display.default.font-size", "path": [ "display", "default", "font-size" ], "originalPath": [ "display", "default", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "display", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.56}", "min": "{typography.font-size.30}" }, "resolved": { "min": "1.875rem", "max": "3.5rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-display-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19216:91", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18040", "targetVariableName": "typography/font-size/56", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19216:91", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18053", "targetVariableName": "typography/font-size/30", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-1.font-size", "path": [ "heading", "level-1", "font-size" ], "originalPath": [ "heading", "level-1", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.36}", "min": "{typography.font-size.32}" }, "resolved": { "min": "2rem", "max": "2.25rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-1", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:86", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18051", "targetVariableName": "typography/font-size/36", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:86", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18046", "targetVariableName": "typography/font-size/32", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-2.font-size", "path": [ "heading", "level-2", "font-size" ], "originalPath": [ "heading", "level-2", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.28}", "min": "{typography.font-size.24}" }, "resolved": { "min": "1.5rem", "max": "1.75rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-2", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:87", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18054", "targetVariableName": "typography/font-size/28", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:87", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18045", "targetVariableName": "typography/font-size/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-3.font-size", "path": [ "heading", "level-3", "font-size" ], "originalPath": [ "heading", "level-3", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.20}", "min": "{typography.font-size.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-3", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:76", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18022", "targetVariableName": "typography/font-size/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:76", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18022", "targetVariableName": "typography/font-size/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-4.font-size", "path": [ "heading", "level-4", "font-size" ], "originalPath": [ "heading", "level-4", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.18}", "min": "{typography.font-size.18}" }, "resolved": { "min": "1.125rem", "max": "1.125rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-4", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:85", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18042", "targetVariableName": "typography/font-size/18", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:85", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18042", "targetVariableName": "typography/font-size/18", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-5.font-size", "path": [ "heading", "level-5", "font-size" ], "originalPath": [ "heading", "level-5", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.16}", "min": "{typography.font-size.16}" }, "resolved": { "min": "1rem", "max": "1rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-5", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:78", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:78", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-6.font-size", "path": [ "heading", "level-6", "font-size" ], "originalPath": [ "heading", "level-6", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.14}", "min": "{typography.font-size.14}" }, "resolved": { "min": "0.875rem", "max": "0.875rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-heading-level-6", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:82", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:82", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.default.font-size", "path": [ "label", "default", "font-size" ], "originalPath": [ "label", "default", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.16}", "min": "{typography.font-size.16}" }, "resolved": { "min": "1rem", "max": "1rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-label-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:88", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:88", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.lg.font-size", "path": [ "label", "lg", "font-size" ], "originalPath": [ "label", "lg", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.18}", "min": "{typography.font-size.18}" }, "resolved": { "min": "1.125rem", "max": "1.125rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-label-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:92", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18042", "targetVariableName": "typography/font-size/18", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:92", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18042", "targetVariableName": "typography/font-size/18", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.sm.font-size", "path": [ "label", "sm", "font-size" ], "originalPath": [ "label", "sm", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.14}", "min": "{typography.font-size.14}" }, "resolved": { "min": "0.875rem", "max": "0.875rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-label-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:85", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:85", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.2xl.font-size", "path": [ "value", "2xl", "font-size" ], "originalPath": [ "value", "2xl", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.48}", "min": "{typography.font-size.36}" }, "resolved": { "min": "2.25rem", "max": "3rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-value-2xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:150", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18050", "targetVariableName": "typography/font-size/48", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:150", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18051", "targetVariableName": "typography/font-size/36", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.lg.font-size", "path": [ "value", "lg", "font-size" ], "originalPath": [ "value", "lg", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.24}", "min": "{typography.font-size.20}" }, "resolved": { "min": "1.25rem", "max": "1.5rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-value-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:138", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18045", "targetVariableName": "typography/font-size/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:138", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18022", "targetVariableName": "typography/font-size/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.md.font-size", "path": [ "value", "md", "font-size" ], "originalPath": [ "value", "md", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.16}", "min": "{typography.font-size.16}" }, "resolved": { "min": "1rem", "max": "1rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-value-md", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:147", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:147", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18021", "targetVariableName": "typography/font-size/16", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.sm.font-size", "path": [ "value", "sm", "font-size" ], "originalPath": [ "value", "sm", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.14}", "min": "{typography.font-size.14}" }, "resolved": { "min": "0.875rem", "max": "0.875rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-value-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:145", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:145", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18052", "targetVariableName": "typography/font-size/14", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.xl.font-size", "path": [ "value", "xl", "font-size" ], "originalPath": [ "value", "xl", "font-size" ], "group": "Typography", "category": "font-size", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.font-size.32}", "min": "{typography.font-size.28}" }, "resolved": { "min": "1.75rem", "max": "2rem" }, "aliasChain": [], "cssVariable": "--lfds-text-size-value-xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:149", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18046", "targetVariableName": "typography/font-size/32", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:149", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18054", "targetVariableName": "typography/font-size/28", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-style.italic", "path": [ "font-style", "italic" ], "originalPath": [ "font-style", "italic" ], "group": "Typography", "category": "font-style", "type": "string", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-style.italic}" }, "resolved": { "base": "italic" }, "aliasChain": "italic", "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:180", "com.figma.aliasData": { "targetVariableId": "VariableID:8199:9598", "targetVariableName": "typography/font-style/italic", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-weight.bold", "path": [ "font-weight", "bold" ], "originalPath": [ "font-weight", "bold" ], "group": "Typography", "category": "font-weight", "type": "number", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-weight.bold}" }, "resolved": { "base": 700 }, "aliasChain": [ "typography.font-weight.bold" ], "cssVariable": "--lfds-font-weight-bold", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:179", "com.figma.aliasData": { "targetVariableId": "VariableID:19211:172", "targetVariableName": "typography/font-weight/bold", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-weight.medium", "path": [ "font-weight", "medium" ], "originalPath": [ "font-weight", "medium" ], "group": "Typography", "category": "font-weight", "type": "number", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-weight.medium}" }, "resolved": { "base": 500 }, "aliasChain": [ "typography.font-weight.medium" ], "cssVariable": "--lfds-font-weight-medium", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:177", "com.figma.aliasData": { "targetVariableId": "VariableID:19211:170", "targetVariableName": "typography/font-weight/medium", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-weight.regular", "path": [ "font-weight", "regular" ], "originalPath": [ "font-weight", "regular" ], "group": "Typography", "category": "font-weight", "type": "number", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-weight.regular}" }, "resolved": { "base": 400 }, "aliasChain": [ "typography.font-weight.regular" ], "cssVariable": "--lfds-font-weight-regular", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:176", "com.figma.aliasData": { "targetVariableId": "VariableID:19211:169", "targetVariableName": "typography/font-weight/regular", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "font-weight.semibold", "path": [ "font-weight", "semibold" ], "originalPath": [ "font-weight", "semibold" ], "group": "Typography", "category": "font-weight", "type": "number", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": "{typography.font-weight.semibold}" }, "resolved": { "base": 600 }, "aliasChain": [ "typography.font-weight.semibold" ], "cssVariable": "--lfds-font-weight-semibold", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:19211:178", "com.figma.aliasData": { "targetVariableId": "VariableID:19211:171", "targetVariableName": "typography/font-weight/semibold", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "typography.heading.level-1", "path": [ "heading", "level-1" ], "originalPath": [ "typography", "heading", "level-1" ], "group": "Typography", "category": "heading", "subCategory": "level-1", "type": "typography", "description": "Typography style heading level-1", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-1.font-size}", "lineHeight": "{heading.level-1.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.heading.level-2", "path": [ "heading", "level-2" ], "originalPath": [ "typography", "heading", "level-2" ], "group": "Typography", "category": "heading", "subCategory": "level-2", "type": "typography", "description": "Typography style heading level-2", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-2.font-size}", "lineHeight": "{heading.level-2.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.heading.level-3", "path": [ "heading", "level-3" ], "originalPath": [ "typography", "heading", "level-3" ], "group": "Typography", "category": "heading", "subCategory": "level-3", "type": "typography", "description": "Typography style heading level-3", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-3.font-size}", "lineHeight": "{heading.level-3.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.heading.level-4", "path": [ "heading", "level-4" ], "originalPath": [ "typography", "heading", "level-4" ], "group": "Typography", "category": "heading", "subCategory": "level-4", "type": "typography", "description": "Typography style heading level-4", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-4.font-size}", "lineHeight": "{heading.level-4.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.heading.level-5", "path": [ "heading", "level-5" ], "originalPath": [ "typography", "heading", "level-5" ], "group": "Typography", "category": "heading", "subCategory": "level-5", "type": "typography", "description": "Typography style heading level-5", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-5.font-size}", "lineHeight": "{heading.level-5.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.heading.level-6", "path": [ "heading", "level-6" ], "originalPath": [ "typography", "heading", "level-6" ], "group": "Typography", "category": "heading", "subCategory": "level-6", "type": "typography", "description": "Typography style heading level-6", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.heading}", "fontWeight": "{font-weight.bold}", "fontSize": "{heading.level-6.font-size}", "lineHeight": "{heading.level-6.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 700 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.label.default", "path": [ "label", "default" ], "originalPath": [ "typography", "label", "default" ], "group": "Typography", "category": "label", "subCategory": "default", "type": "typography", "description": "Typography style label default", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.label}", "fontWeight": "{font-weight.regular}", "fontSize": "{label.default.font-size}", "lineHeight": "{label.default.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.label.lg", "path": [ "label", "lg" ], "originalPath": [ "typography", "label", "lg" ], "group": "Typography", "category": "label", "subCategory": "lg", "type": "typography", "description": "Typography style label lg", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.label}", "fontWeight": "{font-weight.regular}", "fontSize": "{label.lg.font-size}", "lineHeight": "{label.lg.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.label.sm", "path": [ "label", "sm" ], "originalPath": [ "typography", "label", "sm" ], "group": "Typography", "category": "label", "subCategory": "sm", "type": "typography", "description": "Typography style label sm", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.label}", "fontWeight": "{font-weight.regular}", "fontSize": "{label.sm.font-size}", "lineHeight": "{label.sm.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "body.default.line-height", "path": [ "body", "default", "line-height" ], "originalPath": [ "body", "default", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-body-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19293:57", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19293:57", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "body.lg.line-height", "path": [ "body", "lg", "line-height" ], "originalPath": [ "body", "lg", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.24}", "min": "{typography.line-height.24}" }, "resolved": { "min": "1.5rem", "max": "1.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-body-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19706:1921", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19706:1921", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "body.sm.line-height", "path": [ "body", "sm", "line-height" ], "originalPath": [ "body", "sm", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "body", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-body-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19293:56", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19293:56", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "caption.default.line-height", "path": [ "caption", "default", "line-height" ], "originalPath": [ "caption", "default", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "caption", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-caption-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:103", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:103", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "display.default.line-height", "path": [ "display", "default", "line-height" ], "originalPath": [ "display", "default", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "display", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.64}", "min": "{typography.line-height.36}" }, "resolved": { "min": "2.25rem", "max": "4rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-display-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19216:82", "com.figma.aliasData": { "targetVariableId": "VariableID:14458:20123", "targetVariableName": "typography/line-height/64", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19216:82", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18027", "targetVariableName": "typography/line-height/36", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-1.line-height", "path": [ "heading", "level-1", "line-height" ], "originalPath": [ "heading", "level-1", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.48}", "min": "{typography.line-height.40}" }, "resolved": { "min": "2.5rem", "max": "3rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-1", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:88", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18047", "targetVariableName": "typography/line-height/48", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:88", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18026", "targetVariableName": "typography/line-height/40", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-2.line-height", "path": [ "heading", "level-2", "line-height" ], "originalPath": [ "heading", "level-2", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.36}", "min": "{typography.line-height.28}" }, "resolved": { "min": "1.75rem", "max": "2.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-2", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:77", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18027", "targetVariableName": "typography/line-height/36", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:77", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18031", "targetVariableName": "typography/line-height/28", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-3.line-height", "path": [ "heading", "level-3", "line-height" ], "originalPath": [ "heading", "level-3", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.24}", "min": "{typography.line-height.24}" }, "resolved": { "min": "1.5rem", "max": "1.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-3", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:75", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:75", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-4.line-height", "path": [ "heading", "level-4", "line-height" ], "originalPath": [ "heading", "level-4", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.24}", "min": "{typography.line-height.24}" }, "resolved": { "min": "1.5rem", "max": "1.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-4", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:83", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:83", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-5.line-height", "path": [ "heading", "level-5", "line-height" ], "originalPath": [ "heading", "level-5", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-5", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:84", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:84", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "heading.level-6.line-height", "path": [ "heading", "level-6", "line-height" ], "originalPath": [ "heading", "level-6", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "heading", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-heading-level-6", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19260:81", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19260:81", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.default.line-height", "path": [ "label", "default", "line-height" ], "originalPath": [ "label", "default", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-label-default", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:87", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:87", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.lg.line-height", "path": [ "label", "lg", "line-height" ], "originalPath": [ "label", "lg", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.24}", "min": "{typography.line-height.24}" }, "resolved": { "min": "1.5rem", "max": "1.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-label-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:91", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:91", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "label.sm.line-height", "path": [ "label", "sm", "line-height" ], "originalPath": [ "label", "sm", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "label", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-label-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:83", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:83", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.2xl.line-height", "path": [ "value", "2xl", "line-height" ], "originalPath": [ "value", "2xl", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.56}", "min": "{typography.line-height.48}" }, "resolved": { "min": "3rem", "max": "3.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-value-2xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:146", "com.figma.aliasData": { "targetVariableId": "VariableID:14084:19514", "targetVariableName": "typography/line-height/56", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:146", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18047", "targetVariableName": "typography/line-height/48", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.lg.line-height", "path": [ "value", "lg", "line-height" ], "originalPath": [ "value", "lg", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.28}", "min": "{typography.line-height.24}" }, "resolved": { "min": "1.5rem", "max": "1.75rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-value-lg", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:137", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18031", "targetVariableName": "typography/line-height/28", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:137", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18034", "targetVariableName": "typography/line-height/24", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.md.line-height", "path": [ "value", "md", "line-height" ], "originalPath": [ "value", "md", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-value-md", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:144", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:144", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.sm.line-height", "path": [ "value", "sm", "line-height" ], "originalPath": [ "value", "sm", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.20}", "min": "{typography.line-height.20}" }, "resolved": { "min": "1.25rem", "max": "1.25rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-value-sm", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:142", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:142", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18041", "targetVariableName": "typography/line-height/20", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "value.xl.line-height", "path": [ "value", "xl", "line-height" ], "originalPath": [ "value", "xl", "line-height" ], "group": "Typography", "category": "line-height", "subCategory": "value", "type": "dimension", "tags": [], "sourceFiles": [ "Typography size.max.tokens.json", "Typography size.min.tokens.json" ], "modes": { "max": "{typography.line-height.40}", "min": "{typography.line-height.36}" }, "resolved": { "min": "2.25rem", "max": "2.5rem" }, "aliasChain": [], "cssVariable": "--lfds-line-height-value-xl", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "max": { "com.figma.variableId": "VariableID:19323:148", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18026", "targetVariableName": "typography/line-height/40", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } }, "min": { "com.figma.variableId": "VariableID:19323:148", "com.figma.aliasData": { "targetVariableId": "VariableID:13113:18027", "targetVariableName": "typography/line-height/36", "targetVariableSetId": "VariableCollectionId:2:141", "targetVariableSetName": "Primitives" } } } } }, { "id": "typography.value.2xl", "path": [ "value", "2xl" ], "originalPath": [ "typography", "value", "2xl" ], "group": "Typography", "category": "value", "subCategory": "2xl", "type": "typography", "description": "Typography style value 2xl", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.value}", "fontWeight": "{font-weight.regular}", "fontSize": "{value.2xl.font-size}", "lineHeight": "{value.2xl.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.value.lg", "path": [ "value", "lg" ], "originalPath": [ "typography", "value", "lg" ], "group": "Typography", "category": "value", "subCategory": "lg", "type": "typography", "description": "Typography style value lg", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.value}", "fontWeight": "{font-weight.regular}", "fontSize": "{value.lg.font-size}", "lineHeight": "{value.lg.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.value.md", "path": [ "value", "md" ], "originalPath": [ "typography", "value", "md" ], "group": "Typography", "category": "value", "subCategory": "md", "type": "typography", "description": "Typography style value md", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.value}", "fontWeight": "{font-weight.regular}", "fontSize": "{value.md.font-size}", "lineHeight": "{value.md.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.value.sm", "path": [ "value", "sm" ], "originalPath": [ "typography", "value", "sm" ], "group": "Typography", "category": "value", "subCategory": "sm", "type": "typography", "description": "Typography style value sm", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.value}", "fontWeight": "{font-weight.regular}", "fontSize": "{value.sm.font-size}", "lineHeight": "{value.sm.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "typography.value.xl", "path": [ "value", "xl" ], "originalPath": [ "typography", "value", "xl" ], "group": "Typography", "category": "value", "subCategory": "xl", "type": "typography", "description": "Typography style value xl", "tags": [], "sourceFiles": [ "Typography.tokens.json" ], "modes": { "base": { "fontFamily": "{font-family.value}", "fontWeight": "{font-weight.regular}", "fontSize": "{value.xl.font-size}", "lineHeight": "{value.xl.line-height}" } }, "resolved": { "base": { "fontFamily": "IBM Plex Sans", "fontWeight": 400 } }, "aliasChain": [], "cssVariable": null, "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": {} }, { "id": "container.min", "path": [ "container", "min" ], "originalPath": [ "container", "min" ], "group": "Unknown", "category": "container", "type": "dimension", "tags": [], "sourceFiles": [ "Layout container.lg.tokens.json", "Layout container.md.tokens.json", "Layout container.sm.tokens.json" ], "modes": { "base": "320px" }, "resolved": { "base": "320px" }, "aliasChain": "320px", "cssVariable": "--lfds-unknown-container-min", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23994:3" } } } }, { "id": "grid.columns.count", "path": [ "grid", "columns", "count" ], "originalPath": [ "grid", "columns", "count" ], "group": "Unknown", "category": "grid", "type": "dimension", "tags": [], "sourceFiles": [ "Layout page.lg.tokens.json", "Layout page.md.tokens.json", "Layout page.sm.tokens.json" ], "modes": { "base": "4px" }, "resolved": { "base": "4px" }, "aliasChain": "4px", "cssVariable": "--lfds-unknown-grid-columns-count", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23789:140" } } } }, { "id": "grid.gap.column-padding", "path": [ "grid", "gap", "column-padding" ], "originalPath": [ "grid", "gap", "column-padding" ], "group": "Unknown", "category": "grid", "type": "dimension", "tags": [], "sourceFiles": [ "Layout page.lg.tokens.json", "Layout page.md.tokens.json", "Layout page.sm.tokens.json" ], "modes": { "base": "16px" }, "resolved": { "base": "16px" }, "aliasChain": "16px", "cssVariable": "--lfds-unknown-grid-gap-column-padding", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23800:2" } } } }, { "id": "grid.max-width", "path": [ "grid", "max-width" ], "originalPath": [ "grid", "max-width" ], "group": "Unknown", "category": "grid", "type": "dimension", "tags": [], "sourceFiles": [ "Layout page.lg.tokens.json", "Layout page.md.tokens.json", "Layout page.sm.tokens.json" ], "modes": { "base": "768px" }, "resolved": { "base": "768px" }, "aliasChain": "768px", "cssVariable": "--lfds-unknown-grid-max-width", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23808:539" } } } }, { "id": "grid.spacing.page-padding", "path": [ "grid", "spacing", "page-padding" ], "originalPath": [ "grid", "spacing", "page-padding" ], "group": "Unknown", "category": "grid", "type": "dimension", "tags": [], "sourceFiles": [ "Layout page.lg.tokens.json", "Layout page.md.tokens.json", "Layout page.sm.tokens.json" ], "modes": { "base": "8px" }, "resolved": { "base": "8px" }, "aliasChain": "8px", "cssVariable": "--lfds-unknown-grid-spacing-page-padding", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23789:138" } } } }, { "id": "viewport.min-width", "path": [ "viewport", "min-width" ], "originalPath": [ "viewport", "min-width" ], "group": "Unknown", "category": "viewport", "type": "dimension", "tags": [], "sourceFiles": [ "Layout page.lg.tokens.json", "Layout page.md.tokens.json", "Layout page.sm.tokens.json" ], "modes": { "base": "375px" }, "resolved": { "base": "375px" }, "aliasChain": "375px", "cssVariable": "--lfds-unknown-viewport-min-width", "visibility": { "isComponent": false, "isPrimitive": false }, "metadata": { "extensions": { "base": { "com.figma.variableId": "VariableID:23788:136" } } } } ] }