Graphite
Canvas
#090c10Panel
#11161cRaised
#161d25Divider
#29323dText
#edf2f7Secondary
#9caab9Action
#65bdffPositive
#36d7a0Negative
#ff6b80The Hybrid Exchange
venue design system.
A consistent visual language for markets, trading, institutional liquidity and venue operations. Use the theme control to inspect the live interface in either palette.
Neutral surfaces. Deliberate signals.
Blue identifies the primary action and active navigation. Green and red communicate positive and negative market states. Labels always accompany colour-dependent states.
Light
Canvas
#f3f5f7Panel
#ffffffRaised
#f8f9fbDivider
#d9dfe7Text
#111820Secondary
#526170Action
#0063b8Positive
#087a55Negative
#bd3046Information before decoration.
Geist
Interface labels, headings and editorial content. Headings use a restrained medium weight and a compact line height.
Geist Mono
Market labels, identifiers, timestamps and reference annotations. Financial readouts use tabular numerals.
A shared component language.
Actions
One primary action per decision. Clear keyboard focus and a minimum 44 px mobile target.
States
Testnet previewExample positive stateNot connected
State labels describe actual availability. A live reference is distinct from a market execution.
Compact by design.
Workspace rhythm
24 px desktop content inset, 20 px panel inset and 16 px section gap. Mobile uses 14 px outer, 16 px panel and 12 px gaps. Terminal panels share 1 px separators.
Edges and structure
3 px panel and control corners. No decorative shadows or glows. Use a single shared boundary for related data rather than multiple nested card borders.
One line. One square pictogram.
The Hybrid wordmark and square pictogram remain the product identity. Use the established vector assets and icon set. Preserve geometry and clear space; do not substitute emoji or a different logo.
Open the brand and media library