Iconography
At Leverage, our iconography is crafted to deliver a cohesive and intuitive visual language across our platform. We categorize our icons into three distinct groups, each serving a specific purpose:
Display Icons
These icons, available in both line and solid variants, are used to communicate various UI components.
This collection is available both as an SVG and Font Icon for developers.
Product Icons
Designed to represent our trading products, these icons include symbols for currency pairing, commodities, and indices. Product icons are essential for quickly identifying and differentiating the various instruments available on our platform, ensuring that traders can easily recognize what they’re interacting with.
To enhance clarity, every product icon is also offered in a monochrome variant. This variant is used to indicate that the market for a particular product is currently closed or that a related trading signal has expired.
Flag Icons
Flag icons are used to represent individual countries, especially when referring to national identities or currencies. They are particularly useful for selections, such as choosing a country of residence or a deposit currency where a distinct visual identifier is necessary to avoid any ambiguity.
Icon Sizes
token-name
semantic token
px
rem
icon-2x-small
numeric-values/80
8px
-0.5rem
star-01-outline
icon-x-small
numeric-values/120
12px
0.75rem
star-01-outline
icon-small
numeric-values/160
16px
1rem
star-01-outline
icon-medium
numeric-values/200
20px
1.25rem
star-01-outline
icon-large
numeric-values/240
24px
1.5rem
star-01-outline
icon-x-large
numeric-values/320
32px
2rem
star-01-outline
icon-2x-large
numeric-values/480
48px
3rem
star-01-outline