| Name | Value | Preview |
|---|---|---|
| --color-theme-primary | #1C1C1C | |
| --color-theme-secondary | #0B39FF | |
| --color-theme-tertiary | #BBC7DD | |
| --color-theme-grey | #CCD5E5 | |
| --color-theme-success | #4BB587 | |
| --color-theme-danger | #F25355 | |
| --color-theme-warn | #FFF03C | |
| --color-theme-info | #4D9AFF | |
| --color-theme-inverse | #FFFFFF |
| Name | Value | Preview |
|---|---|---|
| --colors-scale-grey-darkest | #778FBB | |
| --colors-scale-grey-dark | #889DC3 | |
| --colors-scale-grey-high | #AAB9D4 | |
| --colors-scale-grey-superior | #BBC7DD | |
| --colors-scale-grey-medium | #CCD5E5 | |
| --colors-scale-grey-normal | #DDE3EE | |
| --colors-scale-grey-light | #EEF1F6 | |
| --colors-scale-grey-lightest | #F8F9FC |
| Name | Value | Preview |
|---|---|---|
| --color-social-media-facebook | #4267B2 | |
| --color-social-media-google | #4688f1 |
| Name | Value | Preview |
|---|---|---|
| --shadow-elevation-01 | 0px 2px 6px #d6f3ff | |
| --shadow-elevation-02 | 0px 2px 10px #b5cdd880 | |
| --shadow-elevation-03 | 0px 2px 6px #C5DAE3 |
| Name | Value | Preview |
|---|---|---|
| --size-nano | 1px | |
| --size-micro | 2px | |
| --size-extra-small | 4px | |
| --size-small | 8px | |
| --size-medium | 16px | |
| --size-large | 24px | |
| --size-extra-large | 32px | |
| --size-jumbo | 40px | |
| --size-extra-jumbo | 48px | |
| --size-giant | 56px | |
| --size-extra-giant | 64px | |
| --size-colossal | 72px | |
| --size-extra-colossal | 80px | |
| --size-mega | 88px | |
| --size-extra-mega | 96px | |
| --size-immense | 104px |
| Name | Value | Preview |
|---|---|---|
| --size-scalable-nano | 10px | |
| --size-scalable-micro | 12px | |
| --size-scalable-extra-small | 14px | |
| --size-scalable-small | 16px | |
| --size-scalable-medium | 18px | |
| --size-scalable-large | 20px | |
| --size-scalable-extra-large | 22px | |
| --size-scalable-jumbo | 24px | |
| --size-scalable-extra-jumbo | 26px | |
| --size-scalable-giant | 28px | |
| --size-scalable-extra-giant | 30px | |
| --size-scalable-colossal | 32px | |
| --size-scalable-extra-colossal | 34px | |
| --size-scalable-mega | 36px | |
| --size-scalable-extra-mega | 38px | |
| --size-scalable-immense | 40px |
| Name | Value | Preview |
|---|---|---|
| --border-radius-normal | 8px | |
| --border-radius-high | 20px | |
| --border-radius-circle | 50% |