
Preview image. Unlock full-res
Fuchsia-accented data panel. Precise, high-contrast, and digitally sharp typography on a stark white canvas, with a single, vibrant fuchsia cutting through the cool neutrality.
The Uniswap Cup design system evokes a digital battle arena with a high-contrast, almost monochrome palette punctuated by a single vibrant fuchsia. The aesthetic is clean and precise, leveraging stark black and white surfaces for visual clarity, while sharp corners and a compact density suggest a dynamic, competitive environment. Typography combines robust monospace with subtle sans-serifs, and layout is highly structured, emphasizing information readouts and tournament brackets over fluid narrative.
Prioritize a stark, high-contrast palette of Midnight Ink (#000000) on Canvas White (#f2f2f2) for all core UI elements.
Use Fuchsia Flare (#f50db4) exclusively for accenting active states, score leaders, competitive highlights, and key interactive elements.
Employ ui-monospace for all numerical data and critical, precise labels, tracking it tightly with letterSpacing: -0.0200em.
Maintain sharp, 0px corner radii for all structural elements and information blocks to preserve a technical, precise feel.
Utilize 8px as the default element spacing for compact arrangement of UI items, such as scores and team logos.
Ensure headings and titles use ui-monospace weight 700 at 32px to convey importance and technical specificity.
Do not introduce additional chromatic colors; Fuchsia Flare (#f50db4) is the singular brand accent.
Avoid soft gradients or shadows; the aesthetic relies on flat, high-contrast surfaces and sharp edges.
Do not use ui-sans-serif or Basel for numerical data or score displays where ui-monospace provides critical alignment and precision.
Refrain from using rounded corners on cards or primary containers; the design language favors a hard-edged, digital aesthetic.
Do not deviate from the compact spacing unit of 8px for inter-element gaps; avoid excessive whitespace that would dilute the information density.
Do not apply padding to ghost buttons; they should remain minimalist and blend seamlessly into their surroundings.









