#standwithukraine

The #standwithukraine design system conveys a sense of urgent, stark information delivery. It utilizes a striking contrast between dark backgrounds and vivid yellow accents, evoking the Ukrainian flag. Typography is dominant and forceful, often with wide letter-spacing, set against minimal UI elements. The overall aesthetic is raw and direct, prioritizing message over decorative flourishes, with a spacious, almost sparse layout that reinforces the gravity of the content. Prioritize text content readability by using Deep Night (#202020) for most text against neutral backgrounds, and Ghost White (#ffffff) against Deep Night backgrounds. Use Freedom Yellow (#f6e54e) exclusively for primary interactive elements (outlined buttons, links) and key informational accents to maintain its impact. Maintain a spacious layout with 32px vertical gaps between major sections and 8px between smaller elements. Apply 0px border-radius for general UI components like cards and text containers, reserving 20px for specific button variants. Employ the Helvetica Neue Cyr font family for all primary text, leveraging its bold weights for headings and wider letter-spacing for dramatic effect. Use transparent backgrounds and Freedom Yellow (#f6e54e) borders for call-to-action buttons, avoiding solid fills to maintain a lightweight, urgent feel. Feature large, impactful headlines (72px or 168px) with tight line heights and significant negative letter-spacing for a sculptural, authoritative presence. Do not introduce new saturated accent colors beyond Freedom Yellow (#f6e54e) and Sky Blue (#77afd8) to preserve the stark brand identity. Avoid solid background fills for interactive buttons; use the outlined style with Freedom Yellow (#f6e54e) to signify interactivity. Do not use subtle elevation or shadows on card components; maintain a flat aesthetic for content containers. Refrain from using decorative gradients or complex visual textures, as the system relies on stark contrasts and direct presentation. Do not use generic system fonts; stick to Helvetica Neue Cyr and Nitti-Normal to uphold the unique typographic voice. Avoid dense information blocks; use generous spacing and clear divisions to ensure content is easily digestible. Do not dilute the contrast by placing light text on Sky Blue (#77afd8) backgrounds, as the contrast ratio is insufficient (2.4:1).