Want to use gradients but not sure how? Here are 10 apps that do it well, with notes on why their approach works.
Vibrant gradient on the app icon and Stories rings. Creates brand recognition and communicates creativity.
Takeaway: Bold gradients work for playful, creative brands.
Spotify Wrapped
Dynamic gradients that change based on user data. Makes the experience feel personal and special.
Takeaway: Personalized gradients increase engagement.
Apple Weather
Gradients communicate temperature and conditions at a glance. Blue for cold, orange for warm.
Takeaway: Gradients can convey information intuitively.
Stripe
Minimal, professional gradients. Subtle enough to not distract from content.
Takeaway: Subtle gradients work for professional/financial apps.
Duolingo
Playful pastel gradients throughout the UI. Makes learning feel fun and welcoming.
Takeaway: Soft gradients create friendly, approachable interfaces.
Headspace
Calming gradients that transition slowly. Creates a relaxing, meditative atmosphere.
Takeaway: Color choice affects emotional response.
Discord
Controlled gradient intensity. Vibrant but not overwhelming. Keeps focus on content.
Takeaway: Balance visual appeal with usability.
Notion
Gentle gradients highlight new features without disrupting workflow.
Takeaway: Use gradients to guide attention subtly.
Airbnb
Refined gradients on booking pages and onboarding. Improves navigation flow.
Takeaway: Gradients can create visual pathways.
Trello
Subtle gradients distinguish lists and cards. Improves organization without visual noise.
Takeaway: Gradients create boundaries without hard lines.
Key Lessons
Purpose & Brand
Match gradient style to brand personality. Playful brands use bold gradients. Professional brands use subtle ones.
Usability First
Gradients should enhance, not distract. Always maintain readability and clear navigation.
Want to implement gradients like these? Our practical tips guide shows you how.
Create your own inspired gradients
Use our gradient tool to recreate these styles or design your own.
Start Creating →