| Name (Variable Name) | Light Mode | Dark Mode |
|---|---|---|
| Text Colors | ||
| --primary-neutral-text | #13151C | #FFFFFF |
| --secondary-neutral-text | #5A6178 | #BCC1D1 |
| --tertiary-neutral-text | #878DA1 | #999FB2 |
| --disabled-primary-neutral-text | #BCC1D1 | #5A6178 |
| --overlay-neutral-text | #FFFFFF | #FFFFFF |
| --inverted-primary-neutral-text | #FFFFFF | #13151C |
| --transparent-neutral-text | #878DA120 | #878DA120 |
| --brand-action-text | #0EB12E | #30CF4F |
| --brand-hover-action-text | #0B8E25 | #3AC054 |
| --brand-var-action-text | #F23D40 | #E9544C |
| --brand-var-hover-action-text | #E0382F | #BF180F |
| --info-action-text | #343B4D | #F2F3F7 |
| --info-hover-action-text | #232733 | #E4E7F0 |
| --disabled-action-text | #BCC1D1 | #5A6178 |
| --positive-text | #13C636 | #6DFF8A |
| --negative-text | #F7191E | #FF474B |
| --orange-text | #FFA114 | #FFC46B |
| --yellow-text | #FFD500 | #FFE66B |
| --mint-text | #0EC7C7 | #60E5E5 |
| --blue-text | #198CF7 | #6BB8FF |
| --purple-text | #B119F7 | #D06BFF |
| --violet-text | #7D19F7 | #AE6BFF |
| Static Colors (Same in light and dark mode) | ||
| --static-neutral-0 | #FFFFFF | #FFFFFF |
| --static-neutral-10 | #F7F8FA | #F7F8FA |
| --static-neutral-20 | #F2F3F7 | #F2F3F7 |
| --static-neutral-30 | #E4E7F0 | #E4E7F0 |
| --static-neutral-40 | #D3D7E3 | #D3D7E3 |
| --static-neutral-50 | #BCC1D1 | #BCC1D1 |
| --static-neutral-60 | #999FB2 | #999FB2 |
| --static-neutral-70 | #878DA1 | #878DA1 |
| --static-neutral-90 | #5A6178 | #5A6178 |
| --static-neutral-91 | #343B4D | #343B4D |
| --static-neutral-92 | #292E3D | #292E3D |
| --static-neutral-93 | #232733 | #232733 |
| --static-neutral-94 | #1C1F29 | #1C1F29 |
| --static-neutral-100 | #13151C | #13151C |
| --static-neutral-110 | #0F121A | #0F121A |
| Gradients | ||
| --neutral-70-transparent | #878da120 | #878da120 |
| --neutral-20-transparent | #f2f3f720 | #f2f3f720 |
| --neutral-gradient-base-94 | #1c1f29 | #1c1f29 |
| --neutral-gradient-transparent-base-94 | #1c1f2920 | #1c1f2920 |
| --indices-gradient-base | #90E589 | #90E589 |
| --crypto-gradient-base | #FFC180 | #FFC180 |
| --currencies-gradient-base | #FFB2E8 | #FFB2E8 |
| --smart-portfolios-gradient-base | #E5B2FF | #E5B2FF |
| --etf-gradient-base | #C7B2FF | #C7B2FF |
| --stocks-gradient-base | #4ADEF7 | #4ADEF7 |
| --people-gradient-base | #59A4FF | #59A4FF |
| --commodities-gradient-base | #8A9BE5 | #8A9BE5 |
| --countries-gradient-base | #6275B2 | #6275B2 |
| --other-gradient-base | #ADB8C9 | #ADB8C9 |
| --orange-primary-gradient-70 | #FFA114 | #FFA114 |
| --orange-primary-gradient-50 | #FFC46B | #FFC46B |
| --yellow-primary-gradient-70 | #FFD500 | #FFD500 |
| --yellow-primary-gradient-50 | #FFE66B | #FFE66B |
| --violet-primary-gradient-70 | #AE6BFF | #AE6BFF |
| --violet-primary-gradient-50 | #D06BFF | #D06BFF |
| --positive-primary-gradient-50 | #6DFF8A | #6DFF8A |
| --positive-primary-gradient-70 | #13C636 | #13C636 |
| --negative-primary-gradient-50 | #FF6B6E | #FF6B6E |
| --negative-primary-gradient-70 | #F7191E | #F7191E |
| Dividers | ||
| --primary-divider | #E4E7F0 | #1C1F29 |
| --secondary-divider | #E4E7F0 | #5A6178 |
| --tertiary-divider | #F2F3F7 | #343B4D |
| Risk Colors | ||
| --risk-1 | #008C17 | #008C17 |
| --risk-2 | #00A61C | #00A61C |
| --risk-3 | #61C200 | #61C200 |
| --risk-4 | #A8D200 | #A8D200 |
| --risk-5 | #E5DC00 | #E5DC00 |
| --risk-6 | #FBC400 | #FBC400 |
| --risk-7 | #FFA318 | #FFA318 |
| --risk-8 | #FF6E1D | #FF6E1D |
| --risk-9 | #E20D0D | #E20D0D |
| --risk-10 | #BB0000 | #BB0000 |
| General Colors | ||
| --indices-primary | #33C728 | #33C728 |
| --crypto-primary | #FF9C33 | #FF9C33 |
| --currencies-primary | #FF80D8 | #FF80D8 |
| --smart-portfolios-primary | #D580FF | #D580FF |
| --etf-primary | #A280FF | #A280FF |
| --stocks-primary | #16C1DF | #16C1DF |
| --people-primary | #0073FF | #0073FF |
| --commodities-primary | #506AE5 | #506AE5 |
| --countries-primary | #2444B2 | #2444B2 |
| --other-primary | #283241 | #283241 |
| --new-wallet | #FF686A | #FF686A |
| --new-usd | #4B5974 | #4B5974 |
| --new-pound | #037FD9 | #037FD9 |
| --new-euro | #13487D | #13487D |
| --primary-20 | #38F55E | #38F55E |
| --primary-30 | #4CE96C | #4CE96C |
| --primary-40 | #30CF4F | #30CF4F |
| --primary-50 | #3AC054 | #3AC054 |
| --primary-60 | #0EB12E | #0EB12E |
| --primary-70 | #0B8E25 | #0B8E25 |
| --primary-var-20 | #FF5F57 | #FF5F57 |
| --primary-var-30 | #E9544C | #E9544C |
| --primary-var-40 | #E0382F | #E0382F |
| --primary-var-50 | #FF474B | #FF474B |
| --primary-var-70 | #BF180F | #BF180F |
| --scrollbar-color | #5A6178 | #343B4D |
| --lightmode-primary-100 | #3FB923 | #ADF68D |
| --lightmode-primary-100-hover | #48C328 | #C1F8A9 |
| --primary-100 | #3FB923 | #3FB923 |
| --primary-100-hover | #48C328 | #C1F8A9 |
| --lightmode-primary-110 | #3DAE23 | #3DAE23 |
| --lightmode-primary-110-hover | #46BA28 | #46BA28 |
| --primary-110 | #3DAE23 | #3DAE23 |
| --primary-110-hover | #46BA28 | #46BA28 |
| --lightmode-primary-10 | #E7F9EA | #ADF68D |
| --lightmode-primary-10-hover | #F1FBF3 | #0a0a0a |
| --primary-10 | #E7F9EA | #3FB923 |
| --primary-10-hover | #F1FBF3 | #0a0a0a |
| --rgb-neutral-0 | 255, 255, 255 | 28, 31, 34 |
| --rgb-neutral-70 | 133, 137, 155 | 122, 118, 100 |
| --rgb-neutral-100 | 0, 0, 0 | 255, 255, 255 |
| --rgb-neutral-20-dm | 50, 55, 75 | 50, 55, 75 |
| --primary-100-dm | #ADF68D | #3FB923 |
| --primary-100-dm-hover | #C1F8A9 | #48C328 |
| --lightmode-primary-var-100 | #E8464A | #F8E4E6 |
| --lightmode-primary-var-100-hover | #F95E63 | #FBEFF1 |
| --primary-var-100 | #E8464A | #E8464A |
| --primary-var-100-hover | #F95E63 | #FF9494 |
| --lightmode-primary-var-110 | #D0021B | #F8E4E6 |
| --lightmode-primary-var-110-hover | #D7021F | #FBEFF1 |
| --primary-var-110 | #D0021B | #F8E4E6 |
| --primary-var-110-hover | #D7021F | #FBEFF1 |
| --lightmode-primary-var-10 | #F8E4E6 | #E8464A |
| --lightmode-primary-var-10-hover | #FBEFF1 | #F95E63 |
| --primary-var-10 | #F8E4E6 | #F8E4E6 |
| --primary-var-10-hover | #FBEFF1 | #FBEFF1 |
| --primary-var-100-dm | #FF6A6A | #E8464A |
| --primary-var-100-dm-hover | #FF9494 | #F95E63 |
| --lightmode-secondary-100 | #2999F5 | #80CDFF |
| --lightmode-secondary-100-hover | #2FA8F6 | #9CD8FF |
| --secondary-100 | #2999F5 | #80CDFF |
| --secondary-100-hover | #2FA8F6 | #9CD8FF |
| --secondary-100-dm | #80CDFF | #2999F5 |
| --secondary-100-dm-hover | #9CD8FF | #2FA8F6 |
| --lightmode-neutral-100 | #2c2c2c | #fff |
| --lightmode-neutral-90 | #777 | #f7f7f7 |
| --lightmode-neutral-70 | #bababa | #85899B |
| --lightmode-neutral-40 | #ddd | #555B70 |
| --lightmode-neutral-20 | #f1f1f1 | #32374B |
| --lightmode-neutral-10 | #f7f7f7 | #fff |
| --lightmode-neutral-0 | #fff | #181C27 |
| --neutral-100 | #2c2c2c | #fff |
| --neutral-90 | #777 | #CACBD1 |
| --neutral-80 | #666666 | #999 |
| --neutral-70 | #bababa | #878da120 |
| --neutral-40 | #ddd | #555B70 |
| --neutral-30 | #e4e4e4 | #292929 |
| --neutral-20 | #f1f1f1 | #f2f3f720 |
| --neutral-10 | #f7f7f7 | #fff |
| --neutral-0 | #fff | #181C27 |
| --neutral-100-dm | #fff | #2c2c2c |
| --neutral-90-dm | #CACBD1 | #777 |
| --lightmode-neutral-dm-70 | #85899B | #bababa |
| --lightmode-neutral-dm-40 | #555B70 | #ddd |
| --lightmode-neutral-dm-20 | #32374B | #f1f1f1 |
| --lightmode-neutral-dm-10 | #272B3A | #2c2c2c |
| --neutral-70-dm | #85899B | #bababa |
| --neutral-40-dm | #555B70 | #ddd |
| --neutral-20-dm | #32374B | #f1f1f1 |
| --neutral-10-dm | #272B3A | #f7f7f7 |
| --neutral-0-dm | #181C27 | #fff |
| --rating-lowest | #3DAE23 | #3DAE23 |
| --rating-low | #48C328 | #3DAE23 |
| --rating-medium | #FBBF3A | #FBBF3A |
| --rating-high | #FD8200 | #FD8200 |
| --rating-highest | #D0021B | #D0021B |
| --usd | #00A44B | #00A44B |
| --euro | #005ca4 | #005ca4 |
| --pound | #037fd9 | #037fd9 |
| Backgrounds | ||
| --neutral-primary-bg | #FFFFFF | #13151C |
| --neutral-secondary-bg | #FFFFFF | #1C1F29 |
| --neutral-tertiary-bg | #FFFFFF | #232733 |
| --neutral-fourthiary-bg | #FFFFFF | #292E3D |
| --neutral-grey-primary-bg | #F2F3F7 | #13151C |
| --neutral-grey-secondary-bg | #F2F3F7 | #1C1F29 |
| --neutral-grey-quaternary-bg | #F2F3F7 | #5A6178 |
| --neutral-grey-quaternary-gradient-base-bg | #F2F3F700 | #5A617800 |
| --neutral-grey-quinary-bg | #E4E7F0 | #343B4D |
| --neutral-mobile-base-bg | #FFFFFF | #0F121A |
| --transparent-primary-bg | #FFFFFF85 | #13151C85 |
| --primary-scroll-base-bg | #FFFFFF00 | #14161C00 |
| --secondary-scroll-base-bg | #FFFFFF00 | #1C1F2900 |
| --tertiary-scroll-base-bg | #FFFFFF00 | #23273300 |
| --grey-primary-bg | #F2F3F7 | #878DA120 |
| --grey-secondary-bg | #F7F8FA | #878DA120 |
| --orange-primary-bg | #FFE1B5 | #FFC46B |
| --orange-secondary-bg | #FFF6E8 | #FFC46B20 |
| --orange-secondary-opaque-bg | #FFF0D9 | #735F41 |
| --orange-tertiary-bg | #FFF6E8 | #4F463E |
| --orange-quaternary-bg | #FFFAF2 | #FFC46B20 |
| --yellow-primary-bg | #FFF3B5 | #FFE66B |
| --yellow-secondary-bg | #FFFBE8 | #FFE66B20 |
| --yellow-secondary-opaque-bg | #FFF9D9 | #736B41 |
| --yellow-tertiary-bg | #FFFBE8 | #4F4D3E |
| --yellow-quaternary-bg | #FFFDF2 | #FFE66B20 |
| --mint-primary-bg | #AFF2F2 | #60E5E5 |
| --mint-secondary-bg | #E6FCFC | #60E5E520 |
| --mint-secondary-opaque-bg | #D7FCFC | #416F73 |
| --mint-tertiary-bg | #E6FCFC | #2F4D57 |
| --mint-quaternary-bg | #F0FCFC | #60E5E520 |
| --blue-primary-bg | #B5DBFF | #6BB8FF |
| --blue-secondary-bg | #E8F4FF | #6BB7FF20 |
| --blue-secondary-opaque-bg | #D9EDFF | #415973 |
| --blue-tertiary-bg | #E8F4FF | #31445C |
| --blue-quaternary-bg | #F2F9FF | #6BB7FF20 |
| --purple-primary-bg | #E7B5FF | #D06BFF |
| --purple-secondary-bg | #F8E8FF | #D06BFF20 |
| --purple-secondary-opaque-bg | #F3D9FF | #574173 |
| --purple-tertiary-bg | #F8E8FF | #46345C |
| --purple-quaternary-bg | #FBF2FF | #D06BFF20 |
| --violet-primary-bg | #D6B5FF | #AE6BFF |
| --violet-secondary-bg | #F2E8FF | #AE6BFF20 |
| --violet-secondary-opaque-bg | #EAD9FF | #604173 |
| --violet-tertiary-bg | #F2E8FF | #3F345C |
| --violet-quaternary-bg | #F8F2FF | #AE6BFF20 |
| --positive-primary-bg | #66EB81 | #6DFF8A |
| --positive-secondary-bg | #E6fAEA | #6DFF8A |
| --positive-tertiary-bg | #E6fAEA | #6DFF8A20 |
| --positive-tertiary-opaque-bg | #D9FFE0 | #417351 |
| --positive-forthiary-bg | #F5FCF6 | #6DFF8A20 |
| --positive-quinary-bg | #B6FFC4 | #6DFF8A |
| --positive-senary-bg | #E6FAEA | #325245 |
| --negative-primary-bg | #FF6B6E | #FF6B6E |
| --negative-secondary-bg | #FAE6E6 | #FF6B6E |
| --negative-tertiary-bg | #FAE6E6 | #FF6B6E20 |
| --negative-tertiary-opaque-bg | #FAD4D4 | #734147 |
| --negative-forthiary-bg | #FCF5F5 | #FF6B6E20 |
| --negative-quinary-bg | #FFB5B6 | #FF6B6E |
| --negative-senary-bg | #FAE6E6 | #4F343F |
| --positive-secondary-transparent-bg | #6DFF8A20 | #6DFF8A20 |
| --positive-secondary-gradient-45-bg | #6DFF8A50 | #6DFF8A50 |
| --positive-secondary-gradient-30-bg | #6DFF8A20 | #6DFF8A20 |
| --positive-secondary-gradient-25-bg | #6DFF8A15 | #6DFF8A15 |
| --positive-secondary-gradient-0-bg | #6DFF8A00 | #6DFF8A00 |
| --negative-secondary-transparent-bg | #FF6B6E20 | #FF6B6E20 |
| --negative-secondary-gradient-45-bg | #FF6B6E50 | #FF6B6E50 |
| --negative-secondary-gradient-30-bg | #FF6B6E20 | #FF6B6E20 |
| --negative-secondary-gradient-25-bg | #FF6B6E15 | #FF6B6E15 |
| --negative-secondary-gradient-0-bg | #FF6B6E00 | #FF6B6E00 |
| Actions | ||
| --brand-actions | #0EB12E | #30CF4F |
| --brand-hover-actions | #3AC054 | #4CE96C |
| --brand-var-actions | #F23D40 | #E9544C |
| --brand-var-hover-actions | #FF474B | #FF5F57 |
| --info-actions | #343B4D | #F2F3F7 |
| --info-hover-actions | #5A6178 | #E4E7F0 |
| --disabled-actions | #F7F8FA | #292E3D |