sweetgreen

Sweetgreen utilizes a high-contrast, brand-aligned color system that mimics its physical retail experience-using deep forest green backgrounds to make the light UI and vibrant food photography pop. The design uses a floating device frame paired with 'exploding' UI elements; by pulling specific cards (like a store selection or customization prompt) out of the main screen container, they focus user attention on specific interactions without losing the context of the full app. The typography strategy is particularly strong, using an elegant serif for headlines to maintain a premium, lifestyle feel while using a clean sans-serif for functional copy. Designers can steal this 'editorial' approach to utility: the copy is benefit-led and brief, allowing the food imagery and clear UI hierarchy to communicate the ease of use.