Design

Cash App's design system navigates between stark order and vibrant expression, built on a dark theme that leverages high contrast and precise typographic control. The core palette is achromatic, allowing saturated brand colors to serve as energetic accents within a highly structured environment. Typography is prominent, employing large, confident sizes and distinctive letter-spacing. UI elements are rendered with minimal visual embellishment, emphasizing function and content, with interaction indicated by subtle borders and color shifts. Prioritize high contrast using Midnight Black and Canvas White for text and backgrounds. Use Ghost Border (#e5e7eb) for subtle structural elements like dividers and non-primary button outlines, not for solid fills. Apply Cash Lime (#00d533) sparingly as a functional accent for interactive states or key brand moments. Employ the CashSans font family at specified weights and sizes, ensuring the global -0.0150em letter-spacing is applied. Maintain 0px border-radius for buttons and cards, preserving a structured and sharp aesthetic. Utilize 12px as the standard element gap for horizontal and vertical spacing between most UI elements. Set section gaps at 64px to create clear visual separation between major content blocks. Avoid using saturated colors other than Cash Lime, unless explicitly defined as semantic status colors. Do not introduce heavy box shadows or gradient overlays, as the system relies on flat surfaces and minimal elevation. Refrain from deviating from the 0px border-radius for interactive components like buttons and cards. Do not use generic system fonts; always default to CashSans for brand consistency. Avoid excessive padding within card components, as they are designed to be content-forward without ornate frames. Do not allow text to have low contrast; ensure sufficient contrast ratios for readability, especially for Subtle Gray and Hinting Gray. Do not use multiple font families; restrict typography to CashSans only.