FemHealth.science Design System
The public reference for the foundations, components, evidence semantics, and editorial rules behind FemHealth. The live page uses the same CSS tokens as the product, so the reference and interface share one source of truth.
FemHealth combines scientific rigour with editorial warmth. The system favours honest data, visible provenance, restrained colour, and clear reading hierarchy.
A warm paper field, burgundy brand accent, warm ink, and stone borders form the core palette. Instrument Serif provides the editorial voice, Inter supports interface reading, and JetBrains Mono identifies scientific metadata.
Evidence colours are semantic. Emerald identifies a signal that was found, neutral slate marks absent or unreported data, burgundy identifies a cohort by design, and amber calls attention to an exclusion or caution.
Canonical surfaces, buttons, chips, forms, and feedback patterns include documented variants and states. WCAG AA contrast, visible focus, text labels, and reduced motion support are required.