Brand specification

commvita™ identity: the working drawing.

Everything a studio needs to reproduce, extend or take over this identity. Geometry is given in artboard units so it scales without ambiguity, and every number here is read from the same source the asset files are generated from.

1 · The mark

Construction.

Four nodes and a hub, joined. The idea is the platform’s own: separate settings, one record in the middle. The asymmetry is deliberate and load-bearing — the nodes sit off the corners at four different radii and four different distances, which is what stops it reading as machine-drawn. Do not regularise it.

Artboard, 100 × 100 units

Node centres and radii are exact. Joins are drawn from the hub centre at 5.0 units wide with round caps.

Clear space

Keep clear space of one hub diameter (30 units, 30% of the artboard) on all four sides. Nothing sits inside it.

Geometry

Node	Centre	r	Fill
1	20, 30	8.5	#00B8A6
2	78, 18	7.0	#7B61FF
3	26, 80	6.0	#FFB020
4	84, 62	9.5	#FF5B47
hub	52, 49	15.0	#141C2E

The hub carries a counter at 40% of its radius, filled with the background colour, so the mark reads as an aperture rather than a blob.

Sizes and the small-use cut

72px

40px

24px

20px small

16px small

Minimum size, standard cut: 24 px / 9 mm. Below that use the small-use cut, which thickens the joins to 9.0 units, drops the smallest node and grows the hub to 19.0. Both cuts ship in the kit; never scale the standard cut below its minimum instead.

2 · Lockups

Four, and when to use each.

Primary, horizontal

The default. Use wherever width allows.

On dark

Joins and “vita” reverse to white; the hub counter takes the background. Teal is unchanged.

Stacked

Square placements: avatars, app stores, exhibition panels.

Without tagline

Below about 160 px wide, or wherever the tagline would set under 9 px. Product navigation uses this.

Proportions are locked. The mark occupies 1.30× the wordmark cap size, the gap between them is 0.36×, and the tagline sets at 0.28× with 0.22× leading above it. The supplied files already carry 0.30× clear space inside the artboard, so a lockup placed flush to its bounding box is correctly spaced.

3 · Misuse

Six things that break it.

Never scale non-proportionally.

Never rotate. The asymmetry has an orientation.

Never substitute node colours. They carry meaning.

No shadows, glows, bevels or gradients.

Do not box the mark except in the supplied app-icon form.

Do not crowd the clear space or rebuild the lockup by hand.

4 · Colour

Five working colours, each with a job.

Colour is semantic here, not decorative. Each hue maps to a line type in the platform’s own architecture, so it means the same thing in the mark, on the website and inside the product. That is the constraint to hold on to: if a colour cannot be explained, it should not be used.

Colour and role	Hex	RGB	CMYK (approx.)
InkStructure, type, the hub	#141C2E	20 28 46	57 39 0 82
TealPerson and record	#00B8A6	0 184 166	100 0 10 28
VioletGolden thread, governance	#7B61FF	123 97 255	52 62 0 0
AmberFlow and operations	#FFB020	255 176 32	0 31 87 0
CoralEntry, escalation, breach	#FF5B47	255 91 71	0 64 72 0
PaperPage ground	#F2F4F7	242 244 247	2 1 0 3

CMYK values are a naive conversion for reference only. Have them proofed and corrected by your printer before any press run, and specify a spot match for the teal if the mark is going on anything that matters.

Contrast, measured

Pair	Ratio	Body text	Large text
Ink on paper	15.43:1	pass	pass
Ink on white	17.00:1	pass	pass
White on ink	17.00:1	pass	pass
Teal on ink	6.81:1	pass	pass
Teal on white	2.50:1	FAIL	FAIL
Coral on white	3.07:1	FAIL	pass

WCAG 2.2 AA. Teal on white fails for body text and is for display sizes, rules and fills only — not for running copy.

5 · Typeface

Familjen Grotesk and Archivo.

Display — Familjen Grotesk, Bold (700)

Care happens
in real time

Headlines and figures. Tracking −0.032em at 24 px and above, −0.04em above 40 px. Line height 1.02–1.08. Never letterspaced positive, never all-caps at display size.

Text — Archivo, Regular and Semibold (400 / 600)

One open record carrying clinical, operational and governance data in a single platform you host yourself. Start at one pound an instance, prove it on your own estate, expand when you choose.

Body, UI and captions. Tracking 0. Line height 1.55–1.62. Use tabular figures wherever numbers align in a column — font-variant-numeric: tabular-nums.

Licence and sourcing

Both families are released under the SIL Open Font License 1.1: free to use, embed, modify and redistribute, including commercially. No licence needs buying and none expires. Full families are at fonts.google.com; the kit ships the Latin subsets used by the artwork, as woff2 for web and static TTF at 400 and 700 for desktop.

Fallback stack: "Familjen Grotesk", "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif. The wordmark in the supplied artwork is outlined, so lockups need no font installed.

6 · Files

What is in the kit.

Folder	Files	What it is for
favicon/	13	App icon and favicon set, plus a multi-resolution .ico.
fonts/	6	Latin subsets used by the artwork. SIL OFL 1.1.
groups/	37
jpg/	4	Flattened. A JPEG cannot hold transparency, so each is supplied on its intended ground.
png/	22	Transparent raster for screen and office documents.
root/	3	Colour tokens as JSON and CSS custom properties.
social/	3	Open Graph card, 1200 × 630.
svg/	14	Masters. Vector, wordmark outlined, no font dependency. Start here for anything new.

All raster files are generated from the SVG masters by script, so the mark in the 16 px favicon is geometrically the same mark as the one on a pull-up banner. If the geometry changes, regenerate rather than redraw.

7 · Open, for the studio

What this specification does not settle.

Print colour. CMYK here is a conversion, not a proof. Teal and violet are both outside a comfortable coated CMYK gamut and will disappoint on press without correction or a spot ink.
Photography. There is none, and the identity needs it. Vector polish is exactly what makes a brand look generated; one real photograph of a ward corridor or a whiteboard does more than any amount of it.
Motion. The mark has an obvious build — nodes arriving, joins drawing in — but no timing, easing or sequence is specified.
The wordmark drawing. It is currently set in Familjen Grotesk Bold and outlined, not drawn. A studio should redraw it: at minimum correct the spacing around the double m and decide whether the teal / ink split survives at small sizes.
Tone of voice. Out of scope here. The one rule worth carrying over: say the positive thing first, and keep em dashes to roughly one per four hundred words.

commvita™ brand specification. Geometry, palette and file index are generated from the same source as the asset kit in docs/brand/, so the two cannot drift apart. Set in Familjen Grotesk and Archivo.