Healthcare palettes
Digital Health & Clinical Wellness Ocean Teal Palette
Restorative ocean teals, soft sky accents, and clean medical slate typography providing comforting, accessible healthcare experiences.
Data reviewed October 24, 2026
Healthcare user experiences must reduce patient anxiety while conveying rigorous clinical competence. The Ocean Teal palette balances calming aquatic tones with crisp, accessible text tokens that satisfy Section 508 and WCAG 2.1 AAA clinical readability guidelines.
| Role | Token Name | Hex Value | Contrast on White | Tailwind Mapping |
|---|---|---|---|---|
| Clinical Primary | Teal 700 | #0f766e | 6.2:1 (AA) | bg-teal-700 |
| Calm Accent | Cyan 600 | #0891b2 | 4.6:1 (AA) | bg-cyan-600 |
| Alert Warning | Amber 600 | #d97706 | 3.8:1 (UI) | text-amber-600 |
| Clinical Black | Slate 900 | #0f172a | 16.1:1 (AAA) | text-slate-900 |
| Neutral Surface | Sky 50 | #f0f9ff | 1.0:1 (Surface) | bg-sky-50 |
| Border Subtle | Slate 200 | #e2e8f0 | 1.2:1 (UI) | border-slate-200 |
Section 508 & Patient Portal Compliance
Telemedicine interfaces serve elderly and visually impaired users. All dosage instructions, laboratory results, and appointment dates must utilize Slate 900 on white or Sky 50 backgrounds, maintaining a minimum 7.0:1 AAA contrast ratio.
Interactive Pill & Appointment Tag Styling
Use soft pastel backgrounds with dark saturated text for medical tags: bg-teal-50 text-teal-800 for completed appointments and bg-amber-50 text-amber-800 for pending lab results.
Frequently asked questions
- Why avoid pure primary blue in modern healthcare apps?
- Deep royal blues can feel overly sterile or bureaucratic. Oceanic teals incorporate warm yellow-green tones that psychological studies associate with healing and tranquility.
- What is Section 508 compliance in digital health?
- Section 508 requires federal agencies and healthcare organizations receiving federal funding to ensure electronic information technology is fully accessible to people with disabilities.
Sources
More in Website palettes
- Modern B2B SaaS Indigo & Slate Design System Palette
- FinTech Emerald & Forest Green Institutional Wealth Palette
- Minimalist Editorial & Publishing Monochrome Slate Palette
- Cybersecurity & DevSecOps Crimson & Obsidian Dark Mode Palette
- Modern Direct-to-Consumer (D2C) Warm Amber & Terracotta Palette
- Creator Economy & Social Video Neon Violet & Fuchsia Palette