
Preview image. Unlock full-res
Event listing, vibrant and clear
Eventbrite employs a lively discovery-platform aesthetic, featuring a bright, almost white canvas punctuated by a single vivid blue for interaction and branding. Typography is direct and legible, supporting a clear hierarchy without being overt. Components are lightweight with subtle borders and generous rounded corners, emphasizing content flow and event visibility over heavy chrome.
Use Canvas White (#ffffff) as the primary page background to create an expansive, light environment.
Apply Oceanic Blue (#3659e3) exclusively for interactive elements like links, outlined buttons, and input borders to signal functionality.
Ensure all cards use a radius of 16px, except for hero-style cards which use 40px 40px 0px 0px for a distinct top edge.
Prioritize Neue Plak family for all text elements, using condensed weights and sizes above 18px for headlines and Neue Plak Text 600 for navigation.
Maintain a comfortable density with 12px for elementGap and cardPadding within components to ensure readability.
Implement Pill Buttons with a 360px radius for a fully rounded, distinct interactive shape.
Use Lavender Ash (#dbdae3) for hairline borders on lists and cards to keep surfaces clean yet structured.
Avoid using highly saturated colors for large background areas, keeping the interface neutral and accent-driven.
Do not introduce strong box-shadows on cards or containers; flatness is preferred to maintain a lightweight feel.
Do not deviate from the Neue Plak family for primary text; it sets the brand's typographic tone.
Do not use generic square buttons; opt for rounded (360px) or ghost buttons as per the design system.
Avoid arbitrary uses of Terracotta (#f05537); reserve it for specific illustrative branding rather than widespread UI elements.
Do not vary from the established spacing units; maintain the 4px base for consistent rhythm and hierarchy.
Do not clutter card content with excessive internal padding; content should define the card's boundaries, not excessive internal whitespace.









