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.



Aperçu
Explorer les écrans
Prévisualisez le design d'app mobile mental health, entièrement modifiable dans Sleek.
À propos de 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.
Ce qu'il y a dedans
Écrans inclus
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 et fonctionnalités
Fonctionnalités clés
- 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
Public
Pour qui c'est fait
Cas d'usage
Ce que vous pouvez créer
- 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
Comment utiliser ce template
- 1
Ouvrir le template
Parcourez les écrans et prévisualisez le design complet pour voir s'il correspond à votre idée.
- 2
Utiliser ce template
Ouvrez votre propre copie entièrement modifiable dans Sleek en un clic.
- 3
Modifier avec l'IA
Restylez la palette, changez les mises en page, et ajoutez ou supprimez des écrans simplement en décrivant ce que vous voulez.
- 4
Exportez et lancez
Exportez votre design ou confiez-le aux développeurs, et poursuivez le développement jusqu'au lancement.
Questions fréquentes
Templates d'apps mobiles associés
Commencez à designer votre app mental health
Utilisez-le dans Sleek et faites-en le vôtre : restylez la palette, modifiez n'importe quel écran avec l'IA, et exportez en code ou Figma.
Utiliser ce template







