| Name (Variable Name) | Light Mode | Dark Mode |
|---|---|---|
| Text, icons & borders / Neutral | ||
| --primary-neutral-text | #13151C | #FFFFFF |
| --secondary-neutral-text | #5A6178 | #BCC1D1 |
| --tertiary-neutral-text | #999FB2 | #999FB2 |
| --disabled-primary-neutral-text | #BCC1D1 | #5A6178 |
| --overlay-neutral-text | #FFFFFF | #FFFFFF |
| --inverted-primary-neutral-text | #13151C | #FFFFFF |
| Dividers | ||
| --primary-divider | #E4E7F0 | #1C1F29 |
| --secondary-divider | #F2F3F7 | #5A6178 |
| --tertiary-divider | #F7F8FA | #343B4D |
| Actions | ||
| --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 |
| Status & labels | ||
| --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 |
| Risk score | ||
| --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 |
| Investment type | ||
| --indices-primary | #33C728 | #33C728 |
| --indices-gradient-base | #90E589 | #90E589 |
| --crypto-primary | #FF9C33 | #FF9C33 |
| --crypto-gradient-base | #FFC180 | #FFC180 |
| --currencies-primary | #FF80D8 | #FF80D8 |
| --currencies-gradient-base | #FFB2E8 | #FFB2E8 |
| --smart-portfolios-primary | #D580FF | #D580FF |
| --smart-portfolios-gradient-base | #E5B2FF | #E5B2FF |
| --etf-primary | #A280FF | #A280FF |
| --etf-gradient-base | #C7B2FF | #C7B2FF |
| --stocks-primary | #16C1DF | #16C1DF |
| --stocks-gradient-base | #4ADEF7 | #4ADEF7 |
| --people-primary | #0073FF | #0073FF |
| --people-gradient-base | #59A4FF | #59A4FF |
| --commodities-primary | #506AE5 | #506AE5 |
| --commodities-gradient-base | #8A9BE5 | #8A9BE5 |
| --countries-primary | #2444B2 | #2444B2 |
| --countries-gradient-base | #6275B2 | #6275B2 |
| --other-primary | #283241 | #283241 |
| --other-gradient-base | #ADB8C9 | #ADB8C9 |
| Wallet | ||
| --wallet | #FF686A | #FF686A |
| --usd | #4B5974 | #4B5974 |
| --pound | #037FD9 | #037FD9 |
| --euro | #13487D | #13487D |
| BG/Surface | ||
| --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-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 |
| --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 |
| --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 |
| BG/Actions | ||
| --brand-actions | #66EB81 | #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 |
| BG-Positive & Negative | ||
| --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 |
| BG-Positive & Negative gradient base | ||
| --positive-primary-gradient-50 | #6DFF8A | #6DFF8A |
| --positive-primary-gradient-70 | #13C636 | #13C636 |
| --positive-secondary-transparent-bg | #6DFF8A20 | #6DFF8A20 |
| --positive-secondary-gradient-45-bg | #6DFF8A50 | #6DFF8A50 |
| --positive-secondary-gradient-30-bg | #6DFF8A30 | #6DFF8A30 |
| --positive-secondary-gradient-25-bg | #6DFF8A15 | #6DFF8A15 |
| --positive-secondary-gradient-0-bg | #6DFF8A00 | #6DFF8A00 |
| --negative-primary-gradient-50 | #FF6B6E | #FF6B6E |
| --negative-primary-gradient-70 | #D0021B | #D0021B |
| --negative-secondary-transparent-bg | #FF6B6E20 | #FF6B6E20 |
| --negative-secondary-gradient-45-bg | #FF6B6E50 | #FF6B6E50 |
| --negative-secondary-gradient-30-bg | #FF6B6E30 | #FF6B6E30 |
| --negative-secondary-gradient-25-bg | #FF6B6E15 | #FF6B6E15 |
| --negative-secondary-gradient-0-bg | #FF6B6E00 | #FF6B6E00 |
| Neutral | ||
| --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 |