Labs · Design system
TopX Terminal
The design system of a quant trading terminal: neutral grey, dense tables and colour with one meaning each. Light and dark tokens, CSS and component previews, free to reuse.
Three rules
- Density first, hierarchy kept: 24 px controls, 2 by 5 px table cells, hierarchy from type steps, weight and background.
- Honest data: a missing value reads unavailable or a dash, never a zero; no simulated curves.
- One colour, one meaning: blue for where you are and what to press, green and red for profit and loss with a sign, amber for data quality.