Skip to main content

Theme

HyperionX uses a dark trading-focused interface with a clean light mode for documentation and lower-intensity workflows.

Dark Mode Tokens​

Recommended public theme tokens:

Background: #0B0F14
Surface: #101820
Surface raised: #111821
Surface hover: #2A3038
Border: #263442
Text: #E5E7EB
Muted text: #9CA3AF
HyperionX blue: #00A3FF
Connection green: #00E676
Warning: #F59E0B
Danger: #EF4444

Light Mode Tokens​

Recommended public light tokens:

Background: #F6F9FC
Surface: #FFFFFF
Surface hover: #E8EEF5
Border: #D3DEE8
Text: #0B0F14
Muted text: #52606D
HyperionX blue: #0078D4
Connection green: #008F5A
Warning: #B7791F
Danger: #C53030

Interaction Rules​

  • Use HyperionX blue for primary actions, active navigation, and brand accents.
  • Use gray hover and selection states in dark trading UI.
  • Avoid neon blue selection highlights on dense property grids, dropdowns, and list rows.
  • Keep dark mode dropdowns, context menus, scroll bars, and popup windows on the same dark surface system.
  • Keep light mode readable with strong borders and no washed-out text.