Skip to main content
Brand System · BSIS 1.0

The Blue Snow brand system, made visible.

One cold, luminous studio identity — a midnight-glacier world, a single owned ultramarine, the Frostmark, and motion that settles rather than sparkles. This is the living kit every Blue Snow website, app, deck, email, and film inherits from one token package.

6 neutral steps5 display accents8 signature moves1 aurora per viewport
FIG.02Color6 neutral · 5 accent

A frozen-light palette, contrast-fenced

The world is dark-forward midnight-glacier with rationed frost-white relief. The owned blue and every accent are display/large only — the fence is encoded in the semantic token, so one variable stays legible in both registers.

Glacier ramp — the spine

Whiteout#F4F8FE
--bs-glacier-50Relief / light groundSurfaceLight-register page ground — never pure #fff.
Snow-white#EAF1FB
--bs-glacier-100Primary text on darkText-safe13.5:1 on midnight — AAA. The default readable color.
Snow-muted#9DB0CC
--bs-glacier-300Secondary text / labelsText-safe6.1:1 on midnight — AA. Captions, eyebrows, meta.
Raised#10294F
--bs-glacier-800Elevated surface / cardsSurfaceOne step up from the ground for panels and cards.
Midnight#0B1E3F
--bs-glacier-900The dominant dark GROUNDSurfaceDark-forward home — the world is built here.
Abyss#060A14
--bs-glacier-950Deepest ground / footerSurfaceThe deepest register; also ink-on-light.

Accent family — display band

Blue Snow Blue#1E47FF
--bs-blue-snow-500Primary — fills, CTAs, displayDisplay / large onlyLOCKED. Display/large ONLY — 2.9:1 fails body text. A fill, never readable text.
Blue Snow / AA#102BA6
--bs-blue-snow-700AA-text fallback (light register)Display / large onlyThe only blue that reads as text — and only on a light ground.
Frost-cyan#5FE3E0
--bs-frost-cyan-500Data, hairlines, mark glintDisplay / large onlyThe cold accent — accent TEXT on dark, focus rings, the one mark glint.
Aurora-mint#3DF5A6
--bs-aurora-mint-500Positive data / signature sweepDisplay / large onlyAlive band — positive deltas, the signature aurora sweep.
Aurora-violet#8B6BFF
--bs-aurora-violet-500Gradient counter-stopDisplay / large onlyHigh band of the aurora wash; diverging-scale violet pole.

The aurora wash — the one signature

A 4-stop sweep, violet → blue-snow → frost-cyan → aurora-mint. The brand’s single loud gesture — used at most once per viewport.

aurora-violetblue-snowfrost-cyanaurora-mint
FIG.03TypographyFraunces · Inter · JetBrains Mono

Editorial type, engineered to a floor

Fraunces carries the studio voice in display, Inter holds the body legible at dashboard density, and JetBrains Mono renders every number with tabular figures. Sizes never fall below the floor.

Display — Fraunces

Ag

Built on the real record.

Body — Inter

Ag

Tall x-height keeps copy legible at 14px on dense dashboards.

Data — JetBrains Mono

0123

$1,492.00 · 13.5:1 · +24%

The scale

Hero / Display--bs-text-heroclamp(2rem, 5vw, 4.5rem)The one scale event per page
H2 — Section--bs-text-h2clamp(1.75rem, 3.5vw, 2.5rem)Section headers
H3 — Subhead--bs-text-h31.25remCard titles, sub-sections
Lead--bs-text-lg1.125remLede paragraphs, hero sub
Body--bs-text-body1remBody copy (≥16px floor)
Label / Eyebrow--bs-text-label0.75remMono eyebrows, KPIs, meta

The floors are SACRED

RuleFloor
Body text≥ 16px
H2≥ 28px
Hero≥ 32px
Banned sizes8 – 11px (never)
Video floor (9:16)≥ 19px · headers ≥ 24 · primary ≥ 34
FIG.04ComponentsThe Frost Kit

The Frost Kit — composed, not hand-rolled

Consistency comes from shared molecules gated by audit:design, not from prose. Each aliases semantic tokens and inherits the contrast law.

ButtonsLive
Primary pillGhost link
Badges & pillsLive
Frost badgeSuccess
Frosted-glass cardLive
A panel on midnight

≤3 per viewport · solid fallback on reduced-transparency.

Stat cardLive
13.5:1

snow-white on midnight · AAA

Input fieldToken-built
Accordion (native)Live
The answer ships in the raw HTML+

Yes — native <details> is visible to crawlers and AI engines, no JavaScript required.

FIG.05Motion8 moves · settle, don’t sparkle

Settle, don’t sparkle

Every signature gesture fires once then freezes; only the ≤8%-alpha snow field persists. Decelerating cubic-bezier(0.16, 1, 0.3, 1), never a spring on type. Reduced-motion resolves to full rest.

FIG.01
Aurora mesh-bloom

The one loud gesture — the aurora wash blooms once on hero load, then settles. ≤1 per viewport.

FIG.02
Snow-drift field

The only persistent motion: frozen-light particles drift at ≤8% alpha, never demanding the eye.

FIG.03
Frost-crystal-draw

A hairline edge draws left→right as a card scrolls in — once — like frost growing on glass.

FIG.04
Frosted-glass settle

Backdrop-blur panels rise and settle into place. The filter itself never animates (cost discipline).

FIG.05
Iris-ignition

The Frostmark arms sweep in from the center, the frost-cyan render head ignites last, then it holds still.

FIG.06
Shimmer-pass

A single cool specular sweep crosses a number or CTA on hover, then freezes. No loop.

FIG.07
Frost-wipe seam

A section seam wipes frost away to reveal the next chapter — the through-the-frost signature.

FIG.08
Magnetic drift

A CTA pulls ≤6px toward the cursor and springs back. The only spring; never on type.

FIG.06Voice & Pillars5 pillars · 4 traits

How the brand sounds

01

Craft over output

We make a smaller number of things at a far higher standard. Restraint is the moat.

02

Built on the real record

Every frame and figure is engineered on real data — never invented, never faked.

03

You own it

You keep the files, the rights, and the outcome. No rented pixels, no lock-in.

04

One studio, every surface

Websites, apps, content, and film all fly the one mark — byte-identical from button to film.

05

Settle, don’t sparkle

One loud thing per view. Everything else is calm, editorial, and frozen in place.

Voice traits

Precise
Specific numbers and named sources over adjectives.
Calm & confident
No hype, no exclamation points, no urgency theatre.
Crafted
Editorial cadence — it reads like a publication, not a pitch.
Honest
Proof over claim. If we can’t show it, we don’t say it.

The rules

  • Say “we”, never “I” — this is a studio.
  • Sell craft, real data, and ownership — never “AI”, never price on “minutes”.
  • Never fabricate social proof or invent competitors.
  • Lead with a hard number; let the work carry the claim.

Brand FAQ

What is the Blue Snow brand system?

The Blue Snow brand system is one cold, luminous studio identity — a midnight-glacier world with a single owned ultramarine, a frozen-light accent family, the Frostmark, and motion that settles rather than sparkles. Every website, app, deck, email, and film inherits it from one token package, so a film frame is byte-identical to a button.

Why is Blue Snow Blue only used at large sizes?

Blue Snow Blue (#1E47FF) scores 2.9:1 against the dark ground, which fails the WCAG floor for body text. The system fences it to fills, CTAs, and display type only; readable text uses snow-white (13.5:1) or snow-muted (6.1:1). The fence is encoded in the semantic token, so authors write one variable and stay compliant in both the dark and light registers.

How many brand colors and signature gestures are there?

There are six neutral steps on the glacier ramp plus five display accents, and exactly eight signature motion moves. The discipline is restraint: at most one loud thing per viewport — the aurora wash appears once per screen, and every signature gesture fires a single time before it freezes.

FIG.07In practiceThe system, applied

Where this system shows up

None of the above is a mood board. Every token, lockup and motion move on this page is the same source the studio's films are built from — change a token and the colour moves in the guidelines, the identity and the motion at once. That is the whole argument for a studio with an engine behind it, and it is easiest to check by watching the output. Browse the full portfolio, read what the studio makes and how a project runs, see the data-video specialty, or read who builds it.

Identity work — the system as the product

Logo systems, brand books and launch films where the deliverable IS the identity.

Everything else — the system as the constraint

Films, data-stories and promos that inherit the grid, the type scale and the motion rules without ever naming them.

Want this applied to your brand? Ask for a free sample — a real frame in your identity, built by hand, before any commitment. Or write to the person who builds it.