Identity Guidelines

brand

Design system, color tokens, typography, and downloadable assets for Conjoined Triangles.

01

The Mark

Two isosceles triangles sharing a vertical edge — a mirrored pair. The left faces right. The right faces left. Together they form a chevron pointing in two directions simultaneously.

Left half#6366F1--accent— Fixed. Assertive.
Right halfvar(--text-muted)— Ambient. Recedes.

The mark never achieves full symmetry. One half holds its color regardless of context; the other dissolves into the background. This asymmetry is intentional.

Minimum size & clear space

12px
20px
32px
48px

Minimum recommended render size is 16px height. Below that, the shared edge becomes indistinct.

02

The Name

“The name is a Silicon Valley reference. If you know, you know.”— about page

The Conjoined Triangles of Success is a concept from the HBO series Silicon Valley — a satirical framework presented with the full earnestness of a startup deck. Naming a developer blog after it is half in-joke, half sincere: good software involves joining things that resist being joined.

Problems and their solutions. Abstractions and their implementations. The thing you shipped and the thing you meant to ship.

The triangles are conjoined. They point in opposite directions. That tension doesn't resolve — it produces.

03

Color System

All colors are defined as CSS custom properties on :root and .dark. Click any swatch to copy the hex value.

04

Typography

Martian Mono--font-martian · Display / UI
conjoined triangles
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Used for: headings, navigation, code, UI chrome, brand mark text. Engineered grid, wide apertures, mechanical rhythm. Rejects the dev-blog default so the chrome feels intentional.
Literata--font-literata · Body copy
Building systems that last
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Used for: body copy, post content, descriptions. Editorial serif with real reading comfort at 17px. Steps back so the monospace voice can lead.
05

Downloads

SVG is lossless and infinitely scalable — prefer it for digital use. PNG exports at 4× resolution (560×400px for the mark) for high-density contexts.

Mark — Transparent
Mark — Transparent
140 × 100px · transparent bg
Mark — Dark
Mark — Dark
140 × 100px · #0d0d0d bg
Mark — Light
Mark — Light
140 × 100px · #fafafa bg
Wordmark — Dark
Wordmark — Dark
320 × 80px · #0d0d0d bg
Wordmark — Light
Wordmark — Light
320 × 80px · #fafafa bg