the brand guide

Alexandria Blue.

Pínax's visual and verbal system — built to point at the number, never at itself. Everything on this page is the living source: the theme tiles below render straight from the product's own registry.

✦ from chaos to catalog, from catalog to command

principles

Four laws. No exceptions.

01

The number is the hero

The brand steps back so the data can step forward. If the logo competes with the number, the logo loses.

02

Motion serves the narrative

Real physics, springs, inertia — never decoration. Every animation must answer: what is it pointing at?

03

A premium control room

Sober, dense with meaning, maximum breathing room. Lineage: Linear, Stripe, Mercury, Palantir, BTG.

04

Data honesty

Never a fabricated number, never a chart that misleads, never roadmap sold as product.

the brand never

  • Flourish without function — if the effect points at nothing, it goes.
  • Rainbow gradients, gratuitous glow, mascots.
  • SHOUTED CAPS in body copy (mono labels are a different thing).
  • Two stars: the estela is ONE — the monogram's single accent.
  • Promising what isn't shipped. The changelog only records what's verified.

the palette

Eight tokens, one rule: 60-30-10.

Ink dominates (60%), surfaces and text structure (30%), and the accent is scarce on purpose (10%) — scarcity is what makes the pointer work. Click any card to copy the hex.

typography

Three voices, one golden ratio.

Aa Bb 0123

Space Grotesk

display — headlines and hero numbers

Aa Bb 0123

Inter

body — reading, always calm

Aa Bb 0123

JetBrains Mono

mono — data, labels, facts

modular scale · φ ≈ 1.618 — the product's real ramp

Agcaption · 9.89pxAgdata · 16.00pxAgbody · 25.89pxAgtitle · 41.89pxAgdisplay · 67.77pxAghero · 109.66px

the monogram

Π and the estela.

Neutral stroke

The Π inherits the text color (Papiro on dark, Tinta on light). Never colored on its own.

One accent only

The estela (4-point star) is the only spot of color — Lápis by default; a theme may override.

Clearspace

Clear area around it ≥ the star's height. Nothing touches the monogram.

Minimum size

16 px tall on screen. Below that, use the star alone — or nothing.

the brand across the 11 themes

Not screenshots — the registry itself.

Each tile below is the product's real theme registry painting the mark: the Π takes the theme's text color, the estela takes its accent, the wordmark takes its display font. Change a theme in the product and this page follows.

PÍNAXAlexandria Bluecontrol room — the current default, sober and precisedark
PÍNAXCinematicthe giant hero number, black + glowdark
PÍNAXLight Editoriallight and dense — confidence, rigorlight
PÍNAXWarm Agencywarm and bold — urgency, energydark
PÍNAXStage Keynotepure stage — maximum breathing room, monumentaldark
PÍNAXTech Gradientproduct and future — gradient, orbitaldark
PÍNAXBoutique Editorialserif editorial — quiet luxury, authority (Playfair)light
PÍNAXMercuryelectric blue over navy — Stripe/Mercury/BTG, premium housedark
PÍNAXSwiss Papergiant grotesk + mono labels — Swiss/Pentagram, plenty of breathing roomlight
PÍNAXFresh Productsoft cards + optimistic lime — a living product, Manropelight
PÍNAXAtelier (Paper & Fire)warm serif editorial (Fraunces) — warm paper + terracotta, magazinelight
PÍNAXNoir Monocromáticomonocromático — preto + serifa + dado luminoso, zero cor (Playfair)dark
PÍNAXSereno Sálviamenta + carvão sereno — calmo e confiante, numeral colossal (Grotesk)light
PÍNAXVitrine de Luza cor não pinta, ILUMINA — card branco, um acento com halo (Manrope)light
PÍNAXMenta Noturnapreto absoluto + menta como único sinal — silencioso e caro (Sora)dark
PÍNAXVioleta de Palconumeral colossal + UMA seta roxa — o dado chega pesado (Grotesk)dark
PÍNAXDossiê Suíçoo gráfico é o argumento — zero cor, metadados em mono (Archivo)dark
PÍNAXAzimute Claroetiqueta + numeral gigante + explicação — consultoria clara (Grotesk)light
PÍNAXFluxo Neona cor marca a DIREÇÃO — pílulas e curvas que convergem (Sora)dark
PÍNAXBrasa Comercialvermelho quente + vidro — urgência de venda, o título vira textura (Manrope)dark
PÍNAXLima Escuropreto + gradiente lima — o futuro em painel radiante (Grotesk)dark
PÍNAXCartaz (cor chapada)cor chapada + preto pesado, zero canto — cartaz, não interface (Archivo)light
PÍNAXEucalipto (sálvia & café)sálvia dessaturada + café, serifa quente — board premium calmo (Fraunces)light
PÍNAXDuotone (foto primeiro)o chrome some para a FOTO mandar — par duotone azul/terra (Grotesk)dark
PÍNAXPrismagreige quente + esmeralda cristalino — deep-tech premium, herói de vidro (Grotesk)dark
PÍNAXPrancha (técnica)serifa roman+itálico + mono técnico, cinza-gelo — market-intelligence (Playfair)dark
PÍNAXPrensa (editorial claro)off-white + display condensado colossal + azul-frio — agência editorial (Archivo)light
PÍNAXNeutra (neumórfico)off-white morno + laranja + neumorfismo macio — SaaS de conversão (Manrope)light
PÍNAXFenda (techno)quase-preto + techno quadrado + violeta-elétrico e ácido — web3/gaming (Sora)dark
PÍNAXDamasco (quiet-warm)apricot fosco + greige, painel-estádio — palco quente calmo (Grotesk)light
PÍNAXExpedição (cinema+HUD)cinema teal+âmbar com grão + HUD cartográfico — documentário/expedição (Grotesk)dark
PÍNAXCofre (data-room)data-room preto + azul elétrico, grade keycap — fintech/segurança (Grotesk)dark
PÍNAXMiragemice-blue→navy + fita-monograma translúcida — sistema de marca SaaS (Grotesk)dark
PÍNAXPersianacorrugado grafite/prata + 1 acento quente — portfólio de agência (Manrope)dark
PÍNAXÍmpeto (esportivo)branco esportivo + foto em motion-blur + marcas de registro — esporte (Archivo)light
PÍNAXClima (ESG)esmeralda→teal aurora + godray — clima/energia/ESG (Sora)dark
PÍNAXNévoa (ghost-glass)grafite tom-sobre-tom + vidro fosco ghost — produto/UI quiet (Sora)dark
PÍNAXFulgor (luz quente)off-white + coluna de luz quente + halo de termos — marca de IA quente (Fraunces)light
PÍNAXCromo (bicolor)cinza-quente claro + headline bicolor + fita-cromo — consultoria clara premium (Grotesk)light

the voice

Say the benefit. Prove with the fact.

how it sounds

  • · Headline = direct benefit, in the reader's language.
  • · Mono label = verifiable fact, lowercase, no adjectives.
  • · English is transcreated, never translated — native voice in both.
  • · Confidence without arrogance: we show, we don't shout.

house vocabulary

the stagecommandcataloghero numberdwellcontrol roomthe guardfounder

These words carry the thesis — use them whole. “Deck” is fine; “slideshow” is not.

in practice

Deck, site, email, LED — the same hand.

always

  • The headline states the benefit; the mono label states the fact.
  • One Lápis accent per surface — it points at the single action.
  • Real product screenshots, always with fictional data.
  • Gold only for ceremony: seal, signature, closing.

never

  • Logo over a busy photo without dimming the background.
  • Stretching, rotating, or drop-shadowing the monogram.
  • Two hero numbers fighting for the same screen.
  • Real client data in any public material.
Joel Ferreira, Pínax's founder

the founder

Joel Ferreira

Accountant in Fortaleza, Brazil — the person the brand talks like. The personal voice is warmer and in first person; the brand voice is the control room. Both obey the same law: the number is the hero.

read the story →