Free health information for every woman in South Africa Urgent symptoms? Start here · Free screening at every public clinic
UBUFAZIResilience Wisdom Womanhood

Brand

Ubufazi means womanhood

From umfazi in isiZulu and isiXhosa. The name says who this is for before a word of English is read.

The logo

A woman in profile in a beaded headwrap. She faces forward, not at the reader: this is a mark about going on with something, not about being looked at. The wordmark under her is set in Cinzel, whose Trajan-like serif the site reuses for the header, over the line Resilience · Wisdom · Womanhood.

The full Ubufazi lockup: the headwrap mark above the UBUFAZI wordmark and the line Resilience Wisdom Womanhood.

Full lockup

Where Ubufazi is the subject rather than the furniture: posters, covers, social cards, partner decks. Always on Warm Sand or white, never on a photograph.

Download SVG · PNG · Original artwork

The mark alone

What the header, the footer and the mobile menu carry, beside the wordmark set in type. It is painted as a mask rather than placed as an image, so one file follows the theme: deep maroon in light mode, the pale brand tint in dark.

Download SVG

Ubufazi favicon: the mark reversed out of a maroon tile.

Icon and favicon

Reversed white out of Ubufazi Maroon, on a simplified outline that still reads at 16px. The installable app icon keeps the mark inside the maskable safe area so Android does not crop her headwrap.

Favicon SVG · 180px · 512px

Palette

Colour, and what each one is for

Maroon carries the name. It is never used as a large heavy field, this is a site people read when they are worried, and it should feel calm.

Swatches

{swatch('#8C2321', 'Ubufazi Maroon', 'The brand. Headlines, buttons, links.')} {swatch('#6B1717', 'Deep Maroon', 'Pressed states and the wordmark.')} {swatch('#C8871B', 'Ochre', 'Emphasis, focus rings, evidence badges.')} {swatch('#2E6244', 'Green', 'Checked and verified.')} {swatch('#FBF6F2', 'Warm Sand', 'Recessed bands. Warmer than grey.')} {swatch('#2B2320', 'Ink', 'Body text. A warm dark brown, never pure black.')}
Typography and usage
ElementSpecification
WordmarkCinzel 600, letterspaced 0.09em
HeadlinesFraunces 600 with optical sizing, warm, not institutional
Body and interfaceInter, 1.05–1.15rem at 1.7 line-height
Corners12px controls · 20px cards · 28px panels · pill buttons
ContrastWCAG 2.2 AA, measured in light and dark mode
NeverPure black text · pure white on maroon at small sizes · heavy maroon fields