Skip to content
FRATRES
Brand system

The mark, the palette, and the rules that keep them intact.

Everything needed to represent Fratres correctly, and the asset files to do it with. If something is not covered here, the answer is almost always restraint.
Applies to
Fratres Limited
Version
1.0
Issued
July 2026
The mark

Two columns of equal height on one shared foundation.

The name is the brief. Fratres is Latin for brothers, so the mark says two — equal in height, equal in weight, neither leading. What stops it being merely a pair is the base: the two stand on one shared foundation.

Read a second way it is a portico, the entrance to an institution. That is a fair description of the work — the firm sells a way in. Three strokes, no curves, no enclosure, nothing to explain.

Bark Brown on Cream Parchment — the default.

Cream on Bark Brown — dark grounds and photography.

Deep Teal — restricted to single-colour applications only.

Construction and clear space
The mark is drawn on a 28-unit grid. Columns at x=9 and x=19 rise from y=4 to the base rule at y=22.6, which spans x=3 to x=25. Stroke weight is 2.8 units throughout, with square terminals.

Minimum clear space on all four sides equals one column stroke width at the size in use. Nothing enters that zone — not type, not a rule, not an image edge, not another logo.

Grid28 × 28 units
Stroke weight2.8 units
TerminalsSquare
Minimum size — mark16px / 5mm
Minimum size — lockup96px / 25mm
Wordmark weight700
Wordmark tracking0.09em
FRATRES

Horizontal lockup — the default for headers and correspondence.

FRATRES

Stacked lockup — square formats and social avatars.

What not to do
  • 01Do not rotate, stretch, skew or condense the mark.
  • 02Do not recolour it to an accent colour. Bark Brown on light, cream or white on dark. Nothing else.
  • 03Do not apply a shadow, glow, outline or gradient — the identity is flat by principle.
  • 04Do not place the mark inside a filled circle, square or badge.
  • 05Do not remove the base rule to make it fit at small sizes. Use the mark larger instead.
  • 06Do not redraw the mark or alter the stroke weight relative to the columns.
  • 07Do not set the wordmark in any weight other than 700, or at any tracking other than 0.09em.
  • 08Do not place the lockup over a busy area of a photograph — move it, or use the reversed mark alone.
Colour

One canvas, one ink, one action colour.

Cream Parchment is the only acceptable page canvas — never pure white. Bark Brown replaces black everywhere, including borders. Deep Teal is the single filled action colour, used for exactly one primary action per view.
Cream Parchment#fff9ee--color-cream-parchmentPage canvas, section backgrounds, card surfaces
Paper White#ffffff--color-paper-whiteElevated surfaces above the cream
Bark Brown#3f322a--color-bark-brownAll text, all structural borders, the mark
Earth#796e65--color-earthSecondary headings, muted labels
Warm Gray#9f968c--color-warm-grayTertiary text, fine print
Stone#c5bdb3--color-stoneHairline dividers — the primary separator
Driftwood#b3aea7--color-driftwoodInput field borders
Light Stone#e5e5e5--color-light-stoneLightest rule, disabled states
Deep Teal#004e4e--color-deep-tealThe single filled action colour
Aubergine#560e4b--color-aubergineDecorative card border
Iris#a56eff--color-irisDecorative card border
Cobalt#3074f9--color-cobaltDecorative card border, link accent
Ice Blue#bfebfe--color-ice-blueTinted input surface
Saffron#feed5a--color-saffronOne-off editorial accent — never a CTA
Amber#c67700--color-amberOne-off editorial accent — never a CTA
Typography

Neue Haas Grotesk Display, set quietly.

Weight 400 carries every headline — the whisper-weight is the defining choice. Weight 700 appears only in section labels and the wordmark. Inter is the interim substitute in use until the production licence is in place.
DisplayTransforming opportunities68px · 400 · 1.05 · 0.54px
Heading LA trusted bridge43px · 400 · 1.09 · 0.39px
HeadingFour capabilities30px · 400 · 1.13 · 0.39px
Heading SGovernment relations22px · 400 · 1.20 · 0.33px
Body LEditorial body copy at the larger measure.16px · 400 · 1.41 · 0.27px
BodyStandard body copy and table values.14px · 400 · 1.43 · 0.24px
LabelSECTION LABEL12px · 700 · 1.17 · 0.017em
CaptionFine print and disclosure10px · 500 · 1.80 · 0.18px

Display sizes are shown capped at 43px here so the table stays readable. Body copy is set at 14px or 16px and never outside that range; 10–13px is reserved for captions, meta and labels.

Downloads

Asset files.

The mark files are pure geometry and safe to use anywhere. The lockups carry the wordmark as live text so the production typeface flows through once licensed — outline them before sending to print.
Complete asset packEverything below, zippedzipMark — SVGBark Brown, transparentsvgMark reversed — SVGCream, for dark groundssvgMark — PNG 1024Transparent backgroundpngMark — PNG 512Transparent backgroundpngMark — PNG 256Transparent backgroundpngHorizontal lockup — SVGMark and wordmarksvgStacked lockup — SVGCentred, for square formatssvgColour reference sheetAll fifteen with hex valuessvgApp icon — 180pxCream groundpngUsage notesClear space, minimum size, restrictionstxt

Assets are regenerated from source by running node scripts/build-brand-assets.mjs. The mark geometry lives in src/components/Logo.tsx and is the single source of truth — change it there and rebuild.

Imagery

Full-bleed landscape and architectural photography carries the emotional weight. Treatment is naturalistic and unfiltered: no duotone, no colour-grading overlay, no vignette, no flare.

Subjects are the delta, working infrastructure, and civic architecture — the physical evidence of the work rather than people performing it. Imagery is full-bleed at section openings and set in a 15px-radius frame when inset as content.

Voice

Institutional, plain, unhurried. A printed annual report, not a pitch deck. Short declarative sentences. British English.

Concrete over promotional: “approvals sit across four authorities” beats “we navigate complexity”. No growth verbs, no superlatives, no exclamation marks. Where a claim would need a number the firm does not have, describe the mechanism instead.

Legal register
Brand queries

Need something not covered here?

Requests for additional formats, print-ready outlined artwork, or permission to use the mark in third-party material are handled through the enquiry form.

Make an enquiry