Brand & social
How Frontier looks and sounds.
The short version of the brand book. Use it for decks, documents, social posts and anything with our name on it.
Color.
Midnight
#071C29 · rgb 7, 28, 41
ink
Text, dark backgrounds, the logo
Copper
#C16839 · rgb 193, 104, 57
accent
The one accent. Use it for one thing per layout.
Ivory
#F5F2EB · rgb 245, 242, 235
paper
Light backgrounds
Slate
#72818A · rgb 114, 129, 138
slate
Neutral lines and shapes
ink-2 · #2F4250
Body copy on light grounds
muted · #56656E
Small labels and captions
line · #DCD7CB
Hairlines on Ivory
accent-ink · #A4552B
Copper text under 24px on light grounds
accent-soft · #E0915F
The accent on Midnight
night-muted · #B7C0C5
Secondary text on Midnight
night-line · #1F3645
Hairlines on Midnight
Type.
Headline
Newsreader 400 · tight tracking
Engineers in the room where the work happens.
Lede
Geist 400 · 20/28
Our engineers scope, build and ship the system in your environment.
Card title
Geist 600 · 21px
Reconcile records. Review exceptions.
Body
Geist 400 · 17px
We agree the scope, time commitment and what success looks like before work starts.
Eyebrow
Geist Mono · uppercase · 0.08em
AI-native engineering consultancy
Logo.
Use only these files, and only on the backgrounds they’re approved for. The first on each background is the primary version. Never pair Copper with Slate. Click a mark to download the SVG.
On Ivory
On Midnight
On Copper
On Slate
Lockup: the mark followed by “Frontier Engineering” in Geist Bold, −0.02em tracking, with a gap of a third to half the mark’s height.
Rules.
One copper thing per layout.
A rule, an eyebrow, a button or the spark in the logo. If two copper elements compete, make one Midnight.
Square corners, hairline structure.
No rounded corners, no drop shadows. Separate things with 1px lines in line or night-line.
Serif only at the top.
Newsreader for the first one or two headline levels, never bold. Geist for everything else.
No new colors.
No gradients, tints or extra hues. If a design needs another shade, pick the closest token.
Voice
Write like an engineer explaining it to a client.
- Write plainly and specifically, the way a senior engineer explains something to a client.
- Headlines are short full sentences with a period, in sentence case.
- Speak to the reader as “you” and about the company as “we”.
- Name measures when making a claim: time to resolution, routing accuracy, response quality.
- No emoji, hype words or exclamation marks.