Brand — Squared Studio

01^1²The mark

A square, squared.

The big square is the studio: solid, exact, unhurried. The small square in the exponent position is what we do to ideas. Read together, they say the name.

Construction16 × 16 units

Ratio 10 : 3 · Gap 1 · Corners 0Unit = 6px at 96px

The idean²

A number, squared, is a number multiplied by itself. A studio, squared, is a studio that multiplies what it touches.

The exponent square is always Signal orange, always top-right, always three tenths the size of the base with a one-unit gap. It is the only place the accent is mandatory. Never replace it with the ² character. It's a square, not a digit.

Clearspace: one exponent square (3U) on all sidesMinimum: 16px

On BlueprintPrimary

mark.svg

On VellumPrimary

mark-ink.svg

On SignalSpecial

mark-mono.svg

Sizes96 · 48 · 16

Below 16px use favicon.svg

04^2²Wordmark & lockups

Wide, heavy, tight.

The wordmark is Archivo at its widest and nearly its heaviest, tracked in so the letters almost touch. "Studio" sits underneath at normal width, spaced out, in Ash. Loud and quiet.

Horizontal lockuplockup.svg

SquaredStudio

Gap between mark and type: one exponent squareMark height = cap height of "SQUARED" + "STUDIO"

Stacked lockuplockup-stacked.svg

SquaredStudio

For square formats and avatars

Specification

SQUARED · Archivo · wdth 125 · wght 800 · caps · tracking −2%
STUDIO · Archivo · wdth 100 · wght 500 · caps · tracking +26%
STUDIO cap height = 55% of SQUARED cap height
STUDIO colour: Slate on Blueprint, #58697D on Vellum
Never set the name in any other family
Never add the ² character to the word

09^3²Colour

Two neutrals and one punctuation mark.

Blueprint is the blue of a cyanotype print. Vellum is the drafting paper it belongs with. Between them they do almost all of the work. Signal is used the way you'd use an exclamation point: rarely, and on purpose. Keep it under five percent of any surface.

Blueprint

The blue of a cyanotype print. Primary surface in dark mode, primary text on Vellum.

#0D1E33RGB 13 · 30 · 51--blueprint

Vellum

Drafting paper. Primary surface in light mode, primary text on Blueprint. Cool, not white.

#EDF2F5RGB 237 · 242 · 245--vellum

Signal

The exponent. Accents, states, hover, the one thing on the page you should look at.

#FF5A1FRGB 255 · 90 · 31--signal

Blueprint Deep

Raised surfaces and cards on Blueprint.

#17304DRGB 23 · 48 · 77--blueprint-3

Slate

Secondary text, labels, lines. Works on both Blueprint and Vellum.

#8A9BB0RGB 138 · 155 · 176--slate

Signal Deep

Signal on Vellum when contrast for small text matters. Pressed states.

#D9430CRGB 217 · 67 · 12--signal-deep

16^4²Typography

One family, every width.

Archivo is a variable grotesk with a width axis from 62 to 125. The brand uses the whole range: expanded for the name, normal for reading, condensed when space is tight. JetBrains Mono handles labels, numbers and anything that behaves like a spec.

Display
Archivo · wdth 125 · wght 800
Caps · tracking −4%

Squared

Headline
Archivo · wdth 100 · wght 700
Tracking −3.5%

Ideas, squared.

Wide
Archivo · wdth 112 · wght 500
Caps · tracking +4%

Studio

Condensed
Archivo · wdth 62 · wght 600
Tracking 0

Built on a forty-eight pixel grid

Body
Archivo · wdth 100 · wght 400
17 / 1.55

Most software gets bigger by adding. Ours gets better by multiplying. Each tool we build makes the next one faster to build, and each problem we solve becomes a primitive we can use again.

Mono
JetBrains Mono · wght 400–600
Labels: 11px · caps · tracking +12%

const unit = 8; // px const cell = unit * 6; // 48 const radius = 0; // always

25^5²Grid & motifs

Show the grid. Count in squares.

The 8px unit and 48px cell are visible on every surface as a faint grid, pale blue on Blueprint like the lines on graph paper. Sections, principles and products are numbered in perfect squares. Every button carries a small exponent on its corner. Nothing has a radius.

Numberingn²

01^1²

04^2²

09^3²

16^4²

Sections, steps, principles, footnotes

The exponent on components

Primary Ghost

9px square, offset −5px, top-right. Grows on hover.

Lines, not shadows

CELL 01

CELL 04

CELL 09

CELL 16

1px hairlines at 14% separate everything. No elevation.

36^6²Voice

Say the short thing.

We write the way we build. Short sentences, concrete nouns, real dates. If a sentence could appear on any other studio's website, cut it.

Direct

"Ships Tuesday."

"We're excited to share an upcoming release timeline."

Dry

"It's a square."

"A bold, geometric brand experience."

Exact

"48px grid. Zero radius."

"A pixel-perfect design language."

49^7²Products

Instruments, named plainly.

Products are instruments and they're named like instruments: a plain word for what they do or where they live. The flagship carries the studio's suffix. Siblings that serve one person share a name and add the surface. Line 01 is weather.

Line 01 · FlagshipmacOS

WeatherStudio Weather, the way you want to see it. For people who love radar.

Mac App StoreStandalone

Line 01 · PairmacOS menu bar

Gauge Your station in the menu bar. For people who own an Ambient Weather station.

Mac App StoreStandalone

Line 01 · PairApple Watch

Gauge Watch Your station on your wrist. Same station, same numbers, one look.

App StoreStandalone

Naming

One word where possible. Two when the second names the surface: Gauge Watch.
Name the job or the place, not the technology. Gauge measures. WeatherStudio is where you work.
The flagship carries "Studio". Squared Studio makes WeatherStudio.
Set product names like a headline: Archivo 700, normal width, tracking −3.5%. No product logos. The mark is the logo.
Every product is standalone. No bundles, no suites, no tiers in the name.

Never

No "App", "Pro", "Plus", "Lite" or version numbers in a name.
No vendor's name in ours. Ambient Weather appears only in a compatibility line, never in a product name.
No abbreviations. "AW" meant something to us and nothing to anyone else.
No weather clichés. No suns, clouds, umbrellas or "sky" puns.

Compatibility lineVerbatim

Made for Ambient Weather stations. Nothing else, on purpose. Works through the Ambient Weather API. You'll need an ambientweather.net account and an API key.

Use on Gauge and Gauge Watch, wherever the product is described

DisclaimerVerbatim

Ambient Weather is a trademark of its owner. Squared Studio is an independent company, not affiliated with or endorsed by Ambient Weather. Gauge and Gauge Watch use the Ambient Weather API with your own account.

Footer of any page or store listing that names Ambient Weather

64^8²Rules

Do. Don't.

Do

Use the mark alone when space is tight. It carries the name.
Keep Signal under five percent of any surface. It's punctuation.
Number things in perfect squares where you can. 01, 04, 09, 16.
Set the name in Archivo at width 125 and weight 800, every time.
Let the grid show. Hairlines, cells, honest structure.
Pair Vellum with Blueprint. Pure white and pure black are off-brand.

Don't

No rounded corners. Not on buttons, not on cards, not on the mark.
No gradients, glows or drop shadows. The grid is the texture.
Don't rotate, skew, outline or recolour the mark. Don't move the exponent.
Don't replace the exponent square with the ² character.
Don't add a second accent colour. One is the point.
Don't write "leverage", "seamless", "delight" or "journey".

81^9²Assets

Take the files.

Vector, no dependencies. The lockup and wordmark files reference Archivo from Google Fonts. For print, open them in Figma or Illustrator with Archivo installed and outline the type.

mark.svgVellum on transparent

mark-ink.svgBlueprint on transparent

mark-mono.svgSingle colour, currentColor

favicon.svgBlueprint tile, 64px

app-icon.svg512px tile with safe area

SquaredStudio

wordmark.svgType only

Squared

lockup.svgHorizontal

Squared

lockup-stacked.svgStacked