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.



미리보기
화면 살펴보기
Sleek에서 완전히 편집 가능한 mental health 모바일 앱 디자인을 미리 보세요.
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.
구성 내용
포함된 화면
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.
디자인 & 기능
주요 기능
- 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
오디언스
이런 분께 맞습니다
활용 사례
이런 것을 만들 수 있습니다
- 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
이 템플릿 사용 방법
- 1
템플릿 열기
화면을 둘러보고 전체 디자인을 미리 보며 아이디어에 맞는지 확인해 보세요.
- 2
이 템플릿 사용
한 번의 클릭으로 Sleek에서 완전히 편집 가능한 사본을 엽니다.
- 3
AI로 편집
원하는 것을 설명하기만 하면 팔레트 재스타일, 레이아웃 변경, 화면 추가·삭제가 가능합니다.
- 4
내보내고 출시
디자인을 내보내거나 개발자에게 넘기고, 출시를 향해 계속 만들어가세요.
자주 묻는 질문
mental health 앱 디자인 시작하기
Sleek에서 사용해 내 것으로 만드세요. 팔레트를 다시 스타일링하고, AI로 어떤 화면이든 편집한 뒤 코드나 Figma로 내보내세요.
이 템플릿 사용







