MediCare+
MediCare+ is a clinical design system for hospital portals and patient management systems. It prioritizes clarity, trust, and error prevention above all else. The calming blue palette is intentionally sterile — evoking the reliability of medical-grade environments. Standard density ensures that forms, data tables, and patient records are legible without ambiguity. Every component is designed with accessibility as a non-negotiable requirement (WCAG AA minimum), large touch targets for bedside tablets, and clear visual hierarchy that prevents critical misreadings.
Color Palette
Typography
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Spacing
Base: 8pxMediCare+ is a clinical design system for hospital portals and patient management systems. It prioritizes clarity, trust, and error prevention above all else. The calming blue palette is intentionally sterile — evoking the reliability of medical-grade environments. Standard density ensures that forms, data tables, and patient records are legible without ambiguity. Every component is designed with accessibility as a non-negotiable requirement (WCAG AA minimum), large touch targets for bedside tablets, and clear visual hierarchy that prevents critical misreadings.
Components
Buttons
Cards
Card Title
Sample body text for the card component.
Card Title
Sample body text for the card component.
Inputs
Chips
Checkbox
default
checked
indeterminate
focus
disabled
RadioButton
default
selected
focus
disabled
Tooltip
default
Elevation & Depth
Do's & Don'ts
Do
Don't
Use with MCP
Don't have the MCP? Install it here