back to home

Use it well, use it wrong, just don’t squish it.

The mark, the palette, the type, the voice. Everything you need to drop each::labs into a deck, a press release, a partnership page, or a stylesheet. SVGs are below. Hex codes copy on click.

Get the marksCopy a hexv1 · refreshed Q1 2026

The full mark.

The primary lockup. Use it whenever you have the room. Always on a flat ink or cream surface; never on Spark, never on a photo.

On darkSVG
On lightSVG

The double colon.

The :: mark for compact use, favicons, app icons, social avatars, embed badges. Same flat treatment as the wordmark.

On darkSVG
On lightSVG

Each product gets its own mark.

Router, trace, sense and workflows ship alongside the platform wordmark when the named product is the subject. Same construction, same colon cadence, same two surfaces.

● router
each::router
Quality-aware routing and automatic fallback.
On darkSVG
On lightSVG
● trace
each::trace
Tag every call. Slice cost by anything.
On darkSVG
On lightSVG
● sense
each::sense
The natural-language agent in front of the catalog.
On darkSVG
On lightSVG
● workflows
each::workflows
A typed graph that chains models as one call.
On darkSVG
On lightSVG

Six ways to ruin the mark.

Most of these are obvious. We list them because someone, somewhere, has already tried.

DON’T

Don’t recolor the mark

It’s ink on cream, or cream on ink. Spark for the eyes, not the wordmark.

DON’T

Don’t squish or stretch

The mark has a fixed aspect ratio. Scale uniformly. No exceptions.

DON’T

Don’t rotate

It reads left to right. Always. Even when the layout is being clever.

DON’T

Don’t replace the ::

The double colon is the icon. Hyphens, dots, slashes break the cadence.

DON’T

Don’t add effects

No shadows, glows, gradients, embosses. The mark ships flat or it doesn’t ship.

DON’T

Don’t crowd it

Leave at least one cap-height of clear space on every side. Always.

Spark is the hero. Everything else gets out of the way.

Nine tokens. Spark is the only accent that earns attention by itself; the rest support, signal, or recede. Values match the live CSS variables; click any hex to copy.

rgb(255, 60, 21)

Primary accent · everything that matters.

rgb(214, 51, 16)

Deep spark · hover and pressed states.

rgb(251, 144, 0)

Warm support · workflows, secondary CTAs.

rgb(80, 70, 230)

Cool support · code, infra, depth.

rgb(255, 197, 52)

Caution · coming-soon, attention pulls.

rgb(34, 197, 94)

Positive · 200s, healthy traces.

rgb(239, 68, 68)

Negative · 5xx, refused, broken.

rgb(14, 13, 10)

Text on light · the near-black we use.

rgb(245, 242, 235)

Canvas · warm cream, not white.

One face. Four weights. That’s it.

Inter handles every label, headline, and paragraph on the site. Optical sizing on display; tightened tracking on big type. Free from Google Fonts.

Aa
Inter · display · semibold
  • Bold 700
  • Semibold 600
  • Medium 500
  • Regular 400

The quick brown fox jumps over the lazy dog.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

  • Display · font-sans semibold · tracking-tightest
  • Body · font-sans regular · 1.55 leading
  • Mono · font-mono medium · tracking-eyebrow for labels