{ "extractedAt": "2026-05-08T03:56:19.858Z", "figmaFileKey": "YbsPRUVmNdsbN40NNwh1Gn", "figmaName": "Drop down List/Item", "nodeId": "1446:118010", "type": "COMPONENT_SET", "pageId": "1421:35865", "pageName": "— — Input/Select box", "description": "", "key": "8773f1adb923a4f4a01aa8e951d38bfdd5ba24b6", "variants": [ { "id": "1446:115704", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3045, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:115705;1715:32296;1565:61260", "I1446:115705;1715:32296;1355:28332", "I1446:115705;1715:32296;1355:28333", "I1446:115705;1715:32296;1565:61646", "I1446:115706;1473:3223", "I1446:115706;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85065", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3117, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85067;1473:3223", "I1563:85067;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:123075", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=No, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3189, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:123077;1473:3223", "I1446:123077;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1682:51947", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=No, Active=No, Disabled=Yes, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3261, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1682:51949;1473:3223", "I1682:51949;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:115710", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3333, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:115712;1473:3223", "I1446:115712;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85048", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=Yes, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3405, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85049;1548:36921;1565:61260", "I1563:85049;1548:36921;1355:28332", "I1563:85049;1548:36921;1355:28333", "I1563:85049;1548:36921;1565:61646", "I1563:85050;1473:3223", "I1563:85050;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1452:53096", "name": "Theme=Dark, Type=Radio, Is Parent=No, Checked=Yes, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3477, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } }, { "type": "SOLID", "visible": true, "opacity": 0.46000000834465027, "blendMode": "NORMAL", "hex": "#000000", "token": { "cssVar": "--text-heading", "figmaName": "Color Type/Text/Heading & Button", "variableId": null, "strategy": "hex-fallback" } } ], "v": null, "compositeToken": { "type": "color-mix", "description": "Derived from layered Figma text fills", "layers": [ { "cssVar": "--brand", "opacity": 1 }, { "cssVar": "--text-heading", "opacity": 0.46000000834465027 } ], "cssExpr": "color-mix(in srgb, var(--text-heading) 46%, var(--brand) 54%)" } }, "vectorNodeIds": [ "I1452:53098;1473:3223", "I1452:53098;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1452:53134", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3549, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1452:53136;1473:3223", "I1452:53136;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85344", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3621, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85346;1473:3223", "I1563:85346;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1561:6448", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=No, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3693, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1561:6450;1473:3223", "I1561:6450;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:115713", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3765, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:115715;1480:74525", "I1446:115715;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2678:49958", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3837, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2678:49960;1480:74525", "I2678:49960;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85030", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=No, Disabled=Yes, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3909, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85032;1473:3223", "I1563:85032;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1561:6478", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 3981, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1561:6480;1473:3223", "I1561:6480;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1434:112678", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4053, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1434:112649;1715:32296;1565:61260", "I1434:112649;1715:32296;1355:28332", "I1434:112649;1715:32296;1355:28333", "I1434:112649;1715:32296;1565:61646", "I1434:112650;1473:3223", "I1434:112650;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:84957", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=No, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4125, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:84959;1473:3223", "I1563:84959;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:123072", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=No, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4197, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:123074;1473:3223", "I1446:123074;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1434:112683", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4269, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1434:112653;1473:3223", "I1434:112653;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:87874", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=Yes, Active=Yes, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4341, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:87876;1473:3223", "I1563:87876;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85082", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4413, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85084;1473:3223", "I1563:85084;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1452:53077", "name": "Theme=Dark, Type=Radio, Is Parent=Yes, Checked=Yes, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4485, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } }, { "type": "SOLID", "visible": true, "opacity": 0.46000000834465027, "blendMode": "NORMAL", "hex": "#000000", "token": { "cssVar": "--text-heading", "figmaName": "Color Type/Text/Heading & Button", "variableId": null, "strategy": "hex-fallback" } } ], "v": null, "compositeToken": { "type": "color-mix", "description": "Derived from layered Figma text fills", "layers": [ { "cssVar": "--brand", "opacity": 1 }, { "cssVar": "--text-heading", "opacity": 0.46000000834465027 } ], "cssExpr": "color-mix(in srgb, var(--text-heading) 46%, var(--brand) 54%)" } }, "vectorNodeIds": [ "I1452:53079;1473:3223", "I1452:53079;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:115228", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4557, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1446:115143;1473:3223", "I1446:115143;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85272", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=No, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4629, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85274;1473:3223", "I1563:85274;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1548:40921", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=No, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4701, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1548:40923;1473:3223", "I1548:40923;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1446:115239", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4773, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1561:6438;1473:3223", "I1561:6438;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85308", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4845, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85310;1473:3223", "I1563:85310;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1548:40943", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=Yes, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4917, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1548:40945;1473:3223", "I1548:40945;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1561:7242", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=Yes, Active=Yes, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 4989, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1561:7244;1473:3223", "I1561:7244;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:84974", "name": "Theme=Dark, Type=Multi, Is Parent=Yes, Checked=Yes, Active=Yes, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5061, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:84976;1473:3223", "I1563:84976;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:84939", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=Yes, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5133, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:84941;1473:3223", "I1563:84941;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85099", "name": "Theme=Dark, Type=Multi, Is Parent=No, Checked=Yes, Active=Yes, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5205, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85101;1473:3223", "I1563:85101;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1561:6818", "name": "Theme=Dark, Type=Selected, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5277, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1561:6820;1480:74525", "I1561:6820;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:85238", "name": "Theme=Dark, Type=Selected, Is Parent=Yes, Checked=Yes, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5349, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:85240;1480:74525", "I1563:85240;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1561:6821", "name": "Theme=Dark, Type=Selected, Is Parent=Yes, Checked=Yes, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5421, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } }, { "type": "SOLID", "visible": true, "opacity": 0.46000000834465027, "blendMode": "NORMAL", "hex": "#000000", "token": { "cssVar": "--text-heading", "figmaName": "Color Type/Text/Heading & Button", "variableId": null, "strategy": "hex-fallback" } } ], "v": null, "compositeToken": { "type": "color-mix", "description": "Derived from layered Figma text fills", "layers": [ { "cssVar": "--brand", "opacity": 1 }, { "cssVar": "--text-heading", "opacity": 0.46000000834465027 } ], "cssExpr": "color-mix(in srgb, var(--text-heading) 46%, var(--brand) 54%)" } }, "vectorNodeIds": [ "I1561:6823;1480:74525", "I1561:6823;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "1563:94614", "name": "Theme=Dark, Type=Selected, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5493, "pH": 12, "pV": null, "pR": 8, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Option 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1563:94616;1480:74525", "I1563:94616;1480:76742" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2675:46908", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5565, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2675:46893;4600:21416;4600:22530;1565:61260", "I2675:46893;4600:21416;4600:22530;1355:28332", "I2675:46893;4600:21416;4600:22530;1355:28333", "I2675:46893;4600:21416;4600:22530;1565:61646", "I2675:46894;1473:3223", "I2675:46894;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2678:48174", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=No, Active=No, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5637, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:2611:57509", "token": { "cssVar": "--text-body", "figmaName": "Color Type/Text/Text_1", "variableId": "VariableID:2611:57509", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2678:48175;1548:32070;1565:61260", "I2678:48175;1548:32070;1355:28332", "I2678:48175;1548:32070;1355:28333", "I2678:48175;1548:32070;1565:61646", "I2678:48176;1473:3223", "I2678:48176;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2675:46928", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=Yes, Active=Yes, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5709, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2675:46929;1548:32070;1565:61260", "I2675:46929;1548:32070;1355:28332", "I2675:46929;1548:32070;1355:28333", "I2675:46929;1548:32070;1565:61646", "I2675:46930;1473:3223", "I2675:46930;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2678:48909", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=Yes, Active=No, Disabled=No, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5781, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2678:48910;1548:32070;1565:61260", "I2678:48910;1548:32070;1355:28332", "I2678:48910;1548:32070;1355:28333", "I2678:48910;1548:32070;1565:61646", "I2678:48911;1473:3223", "I2678:48911;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2675:46911", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=Yes, Active=Yes, Disabled=No, Hover=Yes", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5853, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#0b2b13", "v": "VariableID:VariableID:1626:104890", "token": { "cssVar": "--brand-match", "figmaName": "UX/Brand/Match,Hover", "variableId": "VariableID:1626:104890", "strategy": "normalized-variable-id" } } ], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#41c760", "v": "VariableID:VariableID:1626:104892", "token": { "cssVar": "--brand-hover", "figmaName": "UX/Brand/Hover", "variableId": "VariableID:1626:104892", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2675:46912;1548:32070;1565:61260", "I2675:46912;1548:32070;1355:28332", "I2675:46912;1548:32070;1355:28333", "I2675:46912;1548:32070;1565:61646", "I2675:46913;1473:3223", "I2675:46913;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null }, { "id": "2675:46945", "name": "Theme=Drop down List, Type=Operation, Is Parent=No, Checked=No, Active=No, Disabled=Yes, Hover=No", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 32, "w": 240, "x": -5062, "y": 5925, "pH": 12, "pV": null, "pR": 12, "pB": null, "gap": 8, "r": null, "layoutMode": "HORIZONTAL", "primaryAxisAlignItems": null, "counterAxisAlignItems": "CENTER", "fills": [], "strokes": [], "strokeWeight": 1, "effects": [], "text": { "characters": "Operation 1", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 14, "fontFamily": "Roboto", "fontWeight": 400, "lineHeightPx": 21, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:2611:57612", "token": { "cssVar": "--text-disabled", "figmaName": "Color Type/Text/Disable", "variableId": "VariableID:2611:57612", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I2675:46946;1548:32070;1565:61260", "I2675:46946;1548:32070;1355:28332", "I2675:46946;1548:32070;1355:28333", "I2675:46946;1548:32070;1565:61646", "I2675:46947;1473:3223", "I2675:46947;1544:5765" ], "description": null, "componentSetId": "1446:118010", "componentPropertyReferences": null } ], "tokenizedAt": "2026-05-08T04:02:55.549Z", "tokenizationStrategy": "variable-id-first-then-hex-fallback", "source": { "sourceLayer": "figma-data/raw/components", "sourceFile": "figma-data/raw/components/drop_down_list_item__1446_118010.json", "rawExtractedAt": "2026-05-08T03:56:19.858Z", "rawNodeId": "1446:118010", "rawSha256": "7f337be9bf34e7ca739761c35907a6058e59c6cf44146d82160ef163f6b85c5c" } }