Mosaic Stack
Brand studies 01 / for discussion
Review guide

Mosaic Stack / identity exploration

One identity.
Many ways to work.

An AI operating system for the things you make, manage, and do together.

Let's choose the visual language before we choose the dashboard. Compare three marks, three sans-serif families, and ten palettes in three appearances.

Start with the mark
HarborLight
Mosaic Stackmosaicstack.dev
Independent pieces.
A shared place to work.

01 / Identity

Recognizable without a color.

Each concept starts as a single-color shape. Choose one to see it in the page header and brand specimen.

Original concept studies, not cleared trademarks. Small-size recognition and final proportions need your judgment. No logo is approved yet.

02 / Typography

A voice you can read all day.

Compare the same content at the same sizes. Each choice changes the board, while these specimens keep their own typeface.

32Section heading20Card title16Body & controls13Supporting labels

Sentence case. Tabular numerals for data. Comfortable line spacing. Monospace reserved for actual code in later designs.

Local Latin font files, four weights each, licensed under SIL OFL. Other scripts fall back to system fonts and need later multilingual testing.

03 / Color system

Ten palettes. Same Mosaic.

Hue relationships give each palette a reason. Contrast determines the usable shades. Choose any appearance directly on a palette card.

LightPale tinted canvas, clean surfaces.

DimCharcoal layers with a restrained tint.

DarkDeep color, with lighter raised surfaces.

Current tokens

Actual values used by this preview, not production configuration.

Success, warning, and error are separate roles. They always have a label or symbol. A red brand palette never makes color alone mean "error".

04 / Iconography & controls

Quiet details. Clear meaning.

One original outline family, with a 24-unit grid and consistent 1.75-unit strokes. Labels carry meaning; icons help recognition.

Interaction specimen / local only

A useful bit of feedback

Try the button and state selector. No workspace or agent is created.

This field stays intact when you preview an error.

Surface & status specimen

Depth without a gradient

Canvas
Surface
Raised surface Selected
  • Ready for review
  • Needs your attention
  • Could not save. Try again.

8 px control corners, 16 px comparison panels, and a 4 px spacing scale. No animation is required to understand a state change.

05 / Your review

Choose a direction,
not a finished brand.

My starting recommendation is Assembly, DM Sans, and Harbor.

The mark connects to the name, the font stays approachable, and blue gets room to be blue. Relay and Aperture offer less literal alternatives.

What I'd like your take on

  1. Which mark feels like Mosaic, including at 16 px?
  2. Which font feels best in controls and longer text?
  3. Which palette should be the default? Try it in all three appearances.
  4. What should feel different before we design the dashboards?

Notes stay in this browser if storage is available. Download a copy to keep them. Nothing is sent to Dewey.