Brand
The mark keeps watch.
The Beacon: an open ring for the monitoring loop, and a dot standing in the gap, the sentinel on watch. One color, one weight, nothing to explain. Everything on this page is the working system, not an aspiration.
The mark
Positive and inverse
One drawing at every size. The ring and dot hold their relationship all the way down to the favicon, with no simplified cut needed.
Construction
The ring opens at the upper right and the dot stands in the opening. Never close the ring, never move the dot, never let anything else occupy the gap.
Keep at least half the mark’s width clear on every side. Nothing shares that space, including the wordmark’s descenders.
The mark holds to 16px unchanged. Below that, use the dot alone.
Sentinel, set in Figtree SemiBold, sentence case, in ink. The “by Rootstuff” attribution is optional and always faint.
Full logo
Mark and wordmark
The mark with the Sentinel wordmark in Figtree SemiBold, outlined to vector paths so the files carry no font dependency and render identically anywhere. Horizontal for headers and sign-offs; stacked where the lockup has to sit in a near-square.
Color
Color means status
The interface is near-monochrome on purpose. Two neutral palettes, paper and carbon, carry everything, so that when green or red appears it can only mean one thing: something is up, or something is down. If it is not live status, it is not colored.
paper
Paper
#FAFAFA
Page background
Card
#EFEFEF
Resting surface
Card raised
#FFFFFF
Surface on a card
Ink
#141414
Text and the mark
carbon
Paper
#141414
Page background
Card
#1F1F1F
Resting surface
Card raised
#262626
Surface on a card
Ink
#F5F5F5
Text and the mark
Status · the only chromatic ink
Up
#3F8E50 · #6FBF7E
Responding as expected
Down
#C24C39 · #E5765F
Failing or unreachable
Degraded
#B98A2E · #D6A64E
Partial or slow
Unknown
#8A8A8A · #969696
Not yet checked
Typography
Three voices
Source Serif 4
Display
Headlines and pull quotes. Regular weight, tight leading, an italic word where the sentence earns it.
Know before your clients do.
Figtree
Interface
Everything you read and click. Regular for body, medium for labels, semibold for the wordmark.
Monitors, alerts, and status pages.
JetBrains Mono
Data
Figures, timestamps, codes, and eyebrows. If a machine produced it, set it in mono.
99.98% · 342ms · UP · 30s
Usage
Please and please don't
Do
- Use the mark in ink on paper surfaces, and in paper on ink surfaces.
- Keep the gap open at the upper right, with the dot inside it.
- Give it clear space of at least half the mark's width on every side.
- Set the wordmark in Figtree SemiBold, next to or below the mark.
- Below 16px, use the dot alone rather than shrinking the ring.
Don't
- Recolor the mark. Color belongs to live status, not to the brand.
- Add gradients, shadows, outlines, or containers around the ring.
- Rotate, flip, or skew it: the gap always faces the upper right.
- Place the mark over photography or busy patterns.
- Pair it with the old indigo palette. That era is over.
Need an asset or a format this page doesn't cover? Get in touch and we'll sort it out.