The mark, and how to use it
Three modules, one pulled forward: a stack of things to do and the one you act on now. This page is the short version of the guidelines; the files are at the bottom.
Construction
A 16-unit grid. Three bars of 10 by 3 with a radius of 1.5 and a gap of 1.5. The Streams mark pulls no bar and sits centred at 3. A product pulls one bar 4 units to the right and gives it the product accent, leaving the other two at 1. Nothing else. It holds at 16 pixels because it is three rectangles, and it sits in the sidebar, the favicon, the app icon and the footer of presentation mode without redrawing.
Clear space and size
Leave one bar height clear on every side. Do not use the mark below 14 pixels; at that size use the favicon variant on ink. The wordmark sets Streams at weight 600 and the product word at weight 500 in the third ink step, so the family reads first.
Do not
- Rotate, outline, add a shadow, a gradient or a container.
- Recolour the bars; only the pulled bar takes colour, and only the product accent.
- Set the wordmark in another face, or in one weight.
- Place the mark on photography without the surface tint behind it.
Colour
A neutral system with one accent that means "this, now". Semantic colours mark a state and never decorate. Every pair is measured at AA or better in both themes.
Light
Dark
Type
Instrument Sans for the interface, JetBrains Mono for anything measured. Both are variable, open-licensed and self-hosted. Sentence case everywhere; no uppercase labels.
Voice
Plain, specific, in the agent's words. Buttons are verbs. Errors say what happened and what to do. No exclamation marks, no emoji, no schema words.
Say
"No follow-ups due. Add one from a person or a property."
Not
"No tasks yet, create your first task!"
Say
"Couldn't save the note. Check your connection and try again."
Not
"Error: unknown error"
The family
Streams products share everything except the accent and which bar is pulled. The Streams mark itself pulls none.
Tools across the family
A tool is not a door. Its mark keeps all three bars in one colour and steps them, each two and a half units further right than the one above.
Downloads
SVG marks and wordmarks for light and dark surfaces, a single-colour mark, and the app icon.
