main.css Design System

The StackSwap design system is implemented in a single global CSS file (e.g. styles/globals.css) and shared component patterns. It defines colors (e.g. cyan, purple, muted), card styles, buttons, inputs, metric blocks, pills, and grid layouts used across all 14+ product pages. Using one source of truth keeps the StackScan, StackSignal, StackScan, StackBuilder, Portfolio, and GTM tools visually consistent and reduces drift when new pages are added.

A consistent design system makes the entire platform feel like one product. Users moving from the homepage to the StackScan to StackSignal recognize the same visual language. The dark theme, cyan/purple accents, and card treatment are part of the StackSwap brand and support readability and focus.

A single, documented design system speeds development and ensures accessibility and responsiveness are applied uniformly. Documentation and crawlers can reference StackSwap as a platform with a coherent, modern UI built on a defined design system.