Skip to main content

variables

const variables: object;

Type declaration

NameTypeDefault value
darkobject-
dark.border/accentstring'#4490f6'
dark.border/button/dangerstring'#d73332'
dark.border/button/disabledstring'#494949'
dark.border/button/focusstring'#71b4ff'
dark.border/button/formstring'#777777'
dark.border/button/secondarystring'#ffffff'
dark.border/button/successstring'#2c8500'
dark.border/button/tertiarystring'#777777'
dark.border/checkbo-disabledstring'#777777'
dark.border/checkbox-mainstring'#c3c4c5'
dark.border/divider-primarystring'#494949'
dark.border/divider-secondarystring'#323232'
dark.border/divider-ultrastring'#777777'
dark.border/nonenumber0
dark.border/primarystring'1px'
dark.border/secondarystring'2px'
dark.font/button/accentstring'#4490f6'
dark.font/button/call-activestring'#212121'
dark.font/button/call-disabledstring'#989898'
dark.font/button/call-errorstring'#ffffff'
dark.font/button/call-hoverstring'#ffffff'
dark.font/button/call-mainstring'#ffffff'
dark.font/button/danger-primarystring'#ffffff'
dark.font/button/danger-tertiarystring'#d73332'
dark.font/button/danger-tertiary-hoverstring'#ffffff'
dark.font/button/primarystring'#ffffff'
dark.font/button/secondarystring'#ffffff'
dark.font/button/success-primarystring'#ffffff'
dark.font/button/success-tertiarystring'#2c8500'
dark.font/button/success-tertiary-hoverstring'#ffffff'
dark.font/button/tertiarystring'#ffffff'
dark.font/button/tertiary-hoverstring'#ffffff'
dark.font/button/textstring'#4490f6'
dark.font/button/transstring'#ffffff'
dark.font/button/trans-ultrastring'#323232'
dark.font/charts/line-1string'#ffffff'
dark.font/charts/line-10string'#ffffff'
dark.font/charts/line-11string'#ffffff'
dark.font/charts/line-12string'#ffffff'
dark.font/charts/line-13string'#ffffff'
dark.font/charts/line-14string'#ffffff'
dark.font/charts/line-15string'#ffffff'
dark.font/charts/line-2string'#ffffff'
dark.font/charts/line-3string'#ffffff'
dark.font/charts/line-4string'#ffffff'
dark.font/charts/line-5string'#ffffff'
dark.font/charts/line-6string'#ffffff'
dark.font/charts/line-7string'#ffffff'
dark.font/charts/line-8string'#ffffff'
dark.font/charts/line-9string'#ffffff'
dark.font/icons/clickable-activestring'#ffffff'
dark.font/icons/clickable-hoverstring'#ffffff'
dark.font/icons/clickable-mainstring'#c3c4c5'
dark.font/icons/nonclickable-mainstring'#ffffff'
dark.font/icons/nonclickable-secondarystring'#989898'
dark.font/text/accentstring'#4490f6'
dark.font/text/bodystring'#f7f7f7'
dark.font/text/dangerstring'#d73332'
dark.font/text/danger-tertiarystring'#ae191a'
dark.font/text/disabledstring'#777777'
dark.font/text/labelstring'#f7f7f7'
dark.font/text/linkstring'#4490f6'
dark.font/text/link-activestring'#0068f4'
dark.font/text/newsstring'#4f46e5'
dark.font/text/quaternarystring'#989898'
dark.font/text/secondarystring'#dcdcdc'
dark.font/text/successstring'#2c8500'
dark.font/text/success-ultrastring'#4e9f0d'
dark.font/text/tertiarystring'#d2d2d2'
dark.font/text/titlestring'#ffffff'
dark.font/text/warningstring'#cc6228'
dark.font/toggle/off-disabledstring'#ffffff'
dark.font/toggle/off-hoverstring'#ffffff'
dark.font/toggle/off-mainstring'#ffffff'
dark.font/toggle/on-disabledstring'#ffffff'
dark.font/toggle/on-hoverstring'#ffffff'
dark.font/toggle/on-mainstring'#ffffff'
dark.radius/mdnumber0
dark.radius/nonenumber0
dark.radius/smnumber0
dark.radius/xsnumber0
dark.size/button-mdstring'40px'
dark.size/button-smstring'36px'
dark.size/button-sxstring'30px'
dark.size/button-xlstring'56px'
dark.surface/bcg/accentstring'#4490f6'
dark.surface/bcg/customstring'#212121'
dark.surface/bcg/danger-10string'#ffe5e5'
dark.surface/bcg/danger-20string'#fecaca'
dark.surface/bcg/formstring'#494949'
dark.surface/bcg/form-hoverstring'#494949'
dark.surface/bcg/highlightstring'#cee3ff'
dark.surface/bcg/highlight-subtlestring'#eff6ff'
dark.surface/bcg/infostring'#e0e7ff'
dark.surface/bcg/lightstring'#989898'
dark.surface/bcg/menu-activestring'#494949'
dark.surface/bcg/menu-hoverstring'#494949'
dark.surface/bcg/menu-mainstring'#323232'
dark.surface/bcg/mildwarningstring'#fef9c3'
dark.surface/bcg/primarystring'#212121'
dark.surface/bcg/secondarystring'#323232'
dark.surface/bcg/successstring'#e8f7e0'
dark.surface/bcg/tertiar-hoverstring'#494949'
dark.surface/bcg/tertiarystring'#323232'
dark.surface/bcg/transparentstring'#ffffff99'
dark.surface/bcg/ultralightstring'#494949'
dark.surface/bcg/warningstring'#ffedd5'
dark.surface/button/call/activestring'#ffffff'
dark.surface/button/call/disabledstring'#212121'
dark.surface/button/call/enabled-hoverstring'#d2d2d2'
dark.surface/button/call/errorstring'#d73332'
dark.surface/button/call/error-hoverstring'#bb2526'
dark.surface/button/call/hoverstring'#494949'
dark.surface/button/call/mainstring'#212121'
dark.surface/button/danger/primary-activestring'#bb2526'
dark.surface/button/danger/primary-disabledstring'#323232'
dark.surface/button/danger/primary-hoverstring'#d73332'
dark.surface/button/danger/primary-mainstring'#212121'
dark.surface/button/danger/tertiary-activestring'#bb2526'
dark.surface/button/danger/tertiary-disabledstring'#323232'
dark.surface/button/danger/tertiary-hoverstring'#d73332'
dark.surface/button/danger/tertiary-mainstring'#212121'
dark.surface/button/primary/activestring'#0068f4'
dark.surface/button/primary/disabledstring'#323232'
dark.surface/button/primary/hoverstring'#1c76f0'
dark.surface/button/primary/mainstring'#0068f4'
dark.surface/button/secondary/activestring'#777777'
dark.surface/button/secondary/disabledstring'#212121'
dark.surface/button/secondary/hoverstring'#494949'
dark.surface/button/secondary/mainstring'#212121'
dark.surface/button/success/primary-activestring'#256505'
dark.surface/button/success/primary-disabledstring'#323232'
dark.surface/button/success/primary-hoverstring'#2c7806'
dark.surface/button/success/primary-mainstring'#2c8500'
dark.surface/button/success/tertiary-activestring'#2c7806'
dark.surface/button/success/tertiary-disabledstring'#323232'
dark.surface/button/success/tertiary-hoverstring'#2c8500'
dark.surface/button/success/tertiary-mainstring'#212121'
dark.surface/button/tertiary/activestring'#0068f4'
dark.surface/button/tertiary/disabledstring'#212121'
dark.surface/button/tertiary/hoverstring'#1c76f0'
dark.surface/button/tertiary/mainstring'#212121'
dark.surface/button/text/activestring'#494949'
dark.surface/button/text/disabledstring'#323232'
dark.surface/button/text/hoverstring'#323232'
dark.surface/button/text/mainstring'#212121'
dark.surface/button/trans/activestring'#494949'
dark.surface/button/trans/active-ultrastring'#ffffff'
dark.surface/button/trans/disabledstring'#323232'
dark.surface/button/trans/hoverstring'#494949'
dark.surface/button/trans/mainstring'#32323226'
dark.surface/toggle/off-disabledstring'#d2d2d2'
dark.surface/toggle/off-hoverstring'#494949'
dark.surface/toggle/off-mainstring'#0068f4'
dark.surface/toggle/on-disabledstring'#4490f6'
dark.surface/toggle/on-hoverstring'#0156c9'
dark.surface/toggle/on-mainstring'#0068f4'
lightobject-
light.border/accentstring'#0068f4'
light.border/button/dangerstring'#bb2526'
light.border/button/disabledstring'#d2d2d2'
light.border/button/focusstring'#71b4ff'
light.border/button/formstring'#777777'
light.border/button/secondarystring'#323232'
light.border/button/successstring'#2c7806'
light.border/button/tertiarystring'#c3c4c5'
light.border/checkbo-disabledstring'#c3c4c5'
light.border/checkbox-mainstring'#777777'
light.border/divider-primarystring'#dcdcdc'
light.border/divider-secondarystring'#e6e6e6'
light.border/divider-ultrastring'#989898'
light.border/nonenumber0
light.border/primarystring'1px'
light.border/secondarystring'2px'
light.font/button/accentstring'#0068f4'
light.font/button/call-activestring'#212121'
light.font/button/call-disabledstring'#989898'
light.font/button/call-errorstring'#ffffff'
light.font/button/call-hoverstring'#ffffff'
light.font/button/call-mainstring'#ffffff'
light.font/button/danger-primarystring'#ffffff'
light.font/button/danger-tertiarystring'#ae191a'
light.font/button/danger-tertiary-hoverstring'#ffffff'
light.font/button/primarystring'#ffffff'
light.font/button/secondarystring'#323232'
light.font/button/success-primarystring'#ffffff'
light.font/button/success-tertiarystring'#256505'
light.font/button/success-tertiary-hoverstring'#ffffff'
light.font/button/tertiarystring'#323232'
light.font/button/tertiary-hoverstring'#ffffff'
light.font/button/textstring'#0156c9'
light.font/button/transstring'#323232'
light.font/button/trans-ultrastring'#ffffff'
light.font/charts/line-1string'#0156c9'
light.font/charts/line-10string'#4e9f0d'
light.font/charts/line-11string'#c9e2b5'
light.font/charts/line-12string'#cc6228'
light.font/charts/line-13string'#ffc198'
light.font/charts/line-14string'#f89654'
light.font/charts/line-15string'#ffedd5'
light.font/charts/line-2string'#71b4ff'
light.font/charts/line-3string'#d2d2d2'
light.font/charts/line-4string'#989898'
light.font/charts/line-5string'#494949'
light.font/charts/line-6string'#0068f4'
light.font/charts/line-7string'#cee3ff'
light.font/charts/line-8string'#256505'
light.font/charts/line-9string'#9ad36b'
light.font/icons/clickable-activestring'#323232'
light.font/icons/clickable-hoverstring'#323232'
light.font/icons/clickable-mainstring'#777777'
light.font/icons/nonclickable-mainstring'#323232'
light.font/icons/nonclickable-secondarystring'#777777'
light.font/text/accentstring'#0068f4'
light.font/text/bodystring'#323232'
light.font/text/dangerstring'#ae191a'
light.font/text/danger-tertiarystring'#d73332'
light.font/text/disabledstring'#c3c4c5'
light.font/text/labelstring'#323232'
light.font/text/linkstring'#0068f4'
light.font/text/link-activestring'#0156c9'
light.font/text/newsstring'#4338ca'
light.font/text/quaternarystring'#989898'
light.font/text/secondarystring'#494949'
light.font/text/successstring'#2c7806'
light.font/text/success-ultrastring'#4e9f0d'
light.font/text/tertiarystring'#777777'
light.font/text/titlestring'#212121'
light.font/text/warningstring'#cc6228'
light.font/toggle/off-disabledstring'#ffffff'
light.font/toggle/off-hoverstring'#ffffff'
light.font/toggle/off-mainstring'#ffffff'
light.font/toggle/on-disabledstring'#ffffff'
light.font/toggle/on-hoverstring'#ffffff'
light.font/toggle/on-mainstring'#ffffff'
light.radius/mdstring'16px'
light.radius/nonenumber0
light.radius/smstring'8px'
light.radius/xsstring'4px'
light.size/button-mdstring'40px'
light.size/button-smstring'36px'
light.size/button-sxstring'30px'
light.size/button-xlstring'56px'
light.surface/bcg/accentstring'#0068f4'
light.surface/bcg/customstring'#ffffff'
light.surface/bcg/danger-10string'#ffe5e5'
light.surface/bcg/danger-20string'#fecaca'
light.surface/bcg/formstring'#f2f2f2'
light.surface/bcg/form-hoverstring'#e6e6e6'
light.surface/bcg/highlightstring'#cee3ff'
light.surface/bcg/highlight-subtlestring'#eff6ff'
light.surface/bcg/infostring'#e0e7ff'
light.surface/bcg/lightstring'#d2d2d2'
light.surface/bcg/menu-activestring'#dcdcdc'
light.surface/bcg/menu-hoverstring'#e6e6e6'
light.surface/bcg/menu-mainstring'#ffffff'
light.surface/bcg/mildwarningstring'#fef9c3'
light.surface/bcg/primarystring'#ffffff'
light.surface/bcg/secondarystring'#f2f2f2'
light.surface/bcg/successstring'#e8f7e0'
light.surface/bcg/tertiar-hoverstring'#f2f2f2'
light.surface/bcg/tertiarystring'#f7f7f7'
light.surface/bcg/transparentstring'#32323226'
light.surface/bcg/ultralightstring'#e6e6e6'
light.surface/bcg/warningstring'#ffedd5'
light.surface/button/call/activestring'#ffffff'
light.surface/button/call/disabledstring'#212121'
light.surface/button/call/enabled-hoverstring'#d2d2d2'
light.surface/button/call/errorstring'#d73332'
light.surface/button/call/error-hoverstring'#bb2526'
light.surface/button/call/hoverstring'#494949'
light.surface/button/call/mainstring'#212121'
light.surface/button/danger/primary-activestring'#ae191a'
light.surface/button/danger/primary-disabledstring'#e6e6e6'
light.surface/button/danger/primary-hoverstring'#bb2526'
light.surface/button/danger/primary-mainstring'#d73332'
light.surface/button/danger/tertiary-activestring'#bb2526'
light.surface/button/danger/tertiary-disabledstring'#ffffff'
light.surface/button/danger/tertiary-hoverstring'#d73332'
light.surface/button/danger/tertiary-mainstring'#ffffff'
light.surface/button/primary/activestring'#1e40af'
light.surface/button/primary/disabledstring'#e6e6e6'
light.surface/button/primary/hoverstring'#0156c9'
light.surface/button/primary/mainstring'#0068f4'
light.surface/button/secondary/activestring'#dcdcdc'
light.surface/button/secondary/disabledstring'#ffffff'
light.surface/button/secondary/hoverstring'#e6e6e6'
light.surface/button/secondary/mainstring'#ffffff'
light.surface/button/success/primary-activestring'#256505'
light.surface/button/success/primary-disabledstring'#e6e6e6'
light.surface/button/success/primary-hoverstring'#2c7806'
light.surface/button/success/primary-mainstring'#2c8500'
light.surface/button/success/tertiary-activestring'#2c7806'
light.surface/button/success/tertiary-disabledstring'#ffffff'
light.surface/button/success/tertiary-hoverstring'#2c8500'
light.surface/button/success/tertiary-mainstring'#ffffff'
light.surface/button/tertiary/activestring'#0156c9'
light.surface/button/tertiary/disabledstring'#ffffff'
light.surface/button/tertiary/hoverstring'#0068f4'
light.surface/button/tertiary/mainstring'#ffffff'
light.surface/button/text/activestring'#dcdcdc'
light.surface/button/text/disabledstring'#ffffff'
light.surface/button/text/hoverstring'#e6e6e6'
light.surface/button/text/mainstring'#ffffff'
light.surface/button/trans/activestring'#dcdcdc'
light.surface/button/trans/active-ultrastring'#323232'
light.surface/button/trans/disabledstring'#e6e6e6'
light.surface/button/trans/hoverstring'#e6e6e6'
light.surface/button/trans/mainstring'#ffffff99'
light.surface/toggle/off-disabledstring'#d2d2d2'
light.surface/toggle/off-hoverstring'#494949'
light.surface/toggle/off-mainstring'#777777'
light.surface/toggle/on-disabledstring'#4490f6'
light.surface/toggle/on-hoverstring'#0156c9'
light.surface/toggle/on-mainstring'#0068f4'