Stryds

Stryds embodies a dark, vibrant gamified aesthetic. The interface uses deep, near-black backgrounds contrasting with neon gradients and vivid accent colors. Typography is bold and assertive, prioritizing impact over traditional readability, often using large scale and tight tracking. Components are rounded and soft, emphasizing a playful yet high-tech feel, with a strategic use of color to highlight active states and primary actions. Always use Deep Space (#040126) for neutral button outlines on dark backgrounds. Prioritize Neon Green (#a6ff00) for all primary calls to action, ensuring button background fills and critical highlights stand out. Apply a 100px border radius to all buttons and small interactive elements, creating a distinct pill-shaped aesthetic. Maintain a section gap of 80px between major content blocks to create a generous, comfortable density. Use Bright Text (#fdfdfd) for all primary headings and body text on dark backgrounds to ensure legibility. Ensure headings use a tight line height, typically 0.95 to 1.25, with negative letter spacing for a compact, impactful look. Backgrounds should predominantly use Midnight Canvas (#000000) or Card Surface (#171717) to maintain the dark theme. Do not use highly saturated colors for large background areas; colors are reserved for accents and interactive elements. Avoid sharp corners; all significant UI elements like cards and buttons should embrace the generous 40px or 100px border radii. Do not use generic system fonts for display typography; Sf Pro Display (or a suitable substitute) is critical for brand impact. Refrain from excessive use of visual hierarchy with shadows; rely on color contrast and spacing for distinction. Do not break the dark theme with light backgrounds for content sections; maintain consistency with the neutral dark palette. Avoid standard letter spacing on headings; always apply the specified negative tracking for a unique type rhythm.