Brand
Brand assets
The mark, the wordmark, and the palette — with the rules that keep them recognisable and the files to use them.
The mark
A page with its top-right corner cut, holding a </>. One closed path and one stroked polyline, on a 512 grid at whole-pixel coordinates — which is why it stays even-weighted at every size instead of thickening as it shrinks.
The wordmark is type, not outlines
It is set live in the site's own typeface rather than shipped as traced paths. That is what lets it rehint at every size, stay selectable and searchable, and inherit colour — and it is why there is no wordmark file to download. Set it in the same weight, or use the mark on its own.Palette
Read from the same module the site renders from, so this page cannot drift from the product. Every pairing used as text is held to WCAG 2.2 AA by test — see the accessibility statement.
accent
#046c4e
accent-strong
#03583f
ink
#1a1815
ink-body
#413c34
ink-muted
#5c574e
paper
#fdfcf7
raised
#ffffff
line
#e5e2d9
| Token | Role | Light | Dark | On paper |
|---|---|---|---|---|
| accent | The green. Links, filled buttons, the mark. | #046c4e | #5ecfa0 | 6.27:1 |
| accent-strong | Hover and active states for the accent. | #03583f | #8fe0bd | 8.27:1 |
| ink | Headings and primary text. | #1a1815 | #f2efe8 | 17.25:1 |
| ink-body | Long-form prose. | #413c34 | #d9d4ca | 10.64:1 |
| ink-muted | Secondary copy and navigation. | #5c574e | #b0aa9d | 6.98:1 |
| paper | The page. A shade off white, deliberately. | #fdfcf7 | #14130f | 1.00:1 |
| raised | Cards and inputs, above the page. | #ffffff | #1d1b16 | 1.03:1 |
| line | Hairlines and dividers. | #e5e2d9 | #33302a | 1.26:1 |
Using it
Do
- Use the supplied files rather than redrawing or tracing the mark.
- Keep clear space around the mark of at least half its height on every side.
- Use the on-dark file on dark backgrounds — the standard green does not carry there.
- Scale the mark proportionally. It is legible down to about 24px; below that use the app icon.
Don't
- Do not add gradients, shadows, strokes, or a container the mark does not have.
- Do not recolour it. The green is the identity; a blue XMLDir mark is not the XMLDir mark.
- Do not set the wordmark in another typeface, or letterspace it to fit a space.
- Do not stretch, rotate, or crop the mark, and do not separate the glyph from its page.
Files
- Mark, SVGVector, for light backgrounds. Scales to any size.
- Mark on dark, SVGThe lighter green, for dark backgrounds.
- App icon, 512 PNGFull-bleed tile, opaque.
- Maskable icon, 512 PNGInset to 72% so a platform crop lands on background.
Every raster is generated from one geometry definition, at stroke weight 34 on the 512 grid, so the favicon and the header mark cannot disagree. Regenerate with npm run icons.
Get started
Bring order to the XML your team can't afford to ignore.
Create a free account and get a private workspace to search, validate, diff, and monitor your XML feeds, sitemaps, schemas, and vendor integrations.