Health & Fitness · Soft Sanctuary
Mental Health App Design Template
Haven is a mental health app design with a Soft Sanctuary look, made for founders and designers building a calm, supportive wellbeing product.



Vorschau
Screens erkunden
Sehen Sie das mental health-Mobile-App-Design in der Vorschau, vollständig editierbar in Sleek.
Über Mental Health App
Haven is a mental health app design template built around a "Soft Sanctuary" aesthetic: a warm sage base, deep forest-ink text, and a single grounding clay-terracotta accent reserved for the primary action and progress arcs. Surfaces float on faint oat-versus-sage contrast with generous rounded corners and no hard borders, while a soft humanist serif keeps every prompt gentle rather than clinical. The result feels like a quiet, sunlit room where it's safe to set everything down.
The template ships six connected screens that form a complete wellbeing flow. A Home screen opens with a warm greeting, a check-in streak, and the signature breathing orb at center, with quick tools for Breathe, Journal, Ground, and Support. From there: a full-screen Mood check-in where you drag across the orb to shift its hue and pick a feeling, a Toolkit of illustrated coping resources for anxiety and sleep, a Journal with guided prompts and past entries, a Mood Trends chart with a gentle non-judgmental insight, and a Support screen with therapist cards and an always-visible crisis line.
Use it in Sleek and make it your own: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export to code, copy into Figma with no plugin, or hand a prompt to an AI agent to build it into a real app, all far faster than starting from a blank canvas.
Was enthalten ist
Enthaltene Screens
Home
A warm serif greeting ("How are you arriving today, Sam?"), a 7-day check-in streak, the gentle breathing orb that taps to begin, and a row of quick tools for Breathe, Journal, Ground, and Support. The calm entry point that anchors the whole app.
Mood Check-in
A full-screen gradient orb you drag across to set how you feel, shifting hue from sky-blue to clay, with mood words like Calm, Anxious, and Tired below and an optional note field. The emotional core of the daily check-in.
Toolkit
Categorized coping resources for Anxiety and Restful Sleep as soft illustrated cards with durations, plus a recommended "5-min Reset" pinned at the top. Helps users find the right exercise in the moment.
Journal
A guided prompt in soft serif ("What's one thing weighing on you today?") with a clay "Write your response" button, and past entries as tonal cards with mood dots and dates. Encourages gentle, regular reflection.
Mood Trends
A calm weekly bar chart in clay and sky-blue, a gentle observation line ("You've felt calmer on days you slept 7+ hours"), and a mood distribution breakdown. Reflection without judgmental scoring.
Support
Licensed therapist cards with warm portraits, specialties, and availability, alongside an always-visible Emergency Help crisis line button in clay and a link to browse the directory. Makes real help easy to reach.
Design & Features
Wichtige Features
- Soft Sanctuary aesthetic: warm sage, forest ink, one clay accent
- Signature breathing orb used as home anchor and mood-logging control
- Tonal-stack depth with no borders and generous rounded corners
- Soft humanist serif prompts paired with a quiet rounded UI font
- Floating oat tab bar with the active icon nested in a sage pebble
- Illustrated coping-resource cards with durations
- Weekly mood trends chart with non-judgmental insights
- Therapist support cards with an always-visible crisis line
Zielgruppe
Für wen es ist
Anwendungsfälle
Was Sie bauen können
- Launch an MVP for a mental health or self-care product
- Mock up screens for an investor or stakeholder pitch
- Hand a consistent, calming UI off to developers
- Explore a redesign of an existing wellbeing app
So nutzen Sie dieses Template
- 1
Template öffnen
Stöbern Sie in den Screens und sehen Sie das komplette Design in der Vorschau, um zu prüfen, ob es zu Ihrer Idee passt.
- 2
Dieses Template nutzen
Öffnen Sie mit einem Klick Ihre eigene, vollständig editierbare Kopie in Sleek.
- 3
Mit KI bearbeiten
Palette umstylen, Layouts ändern und Screens hinzufügen oder entfernen – einfach indem Sie beschreiben, was Sie wollen.
- 4
Exportieren und launchen
Exportieren Sie Ihr Design oder geben Sie es an Entwickler weiter, und bauen Sie weiter Richtung Launch.
Häufig gestellte Fragen
Verwandte Mobile-App-Templates
Beginnen Sie mit dem Design Ihrer mental health-App
Nutzen Sie es in Sleek und machen Sie es zu Ihrem: Palette umstylen, jeden Screen mit KI bearbeiten und nach Code oder Figma exportieren.
Dieses Template nutzen







