Mesa Assembly
Stylebook.
Mesa’s editorial identity brings a broad software portfolio together. Cream, ink, and Mesa Orange form the foundation; expressive serif headlines and a precise pixel accent supply the character.
The House Brand · Est. 2025A mark with
character.
Use the original artwork. Preserve its proportions, keep it clear of competing elements, and choose a background that gives it room to read.
Current artwork · SVG
Color, with
purpose.
Exact values from the identity. Select a swatch to copy its HEX code. Pair color with readable labels and choose text colors with sufficient contrast.
Core - cream, ink, Mesa Orange
Supporting accents
Every word,
considered.
A deliberate hierarchy, from the first headline to the smallest label. The specimens use each brand’s actual typefaces.
Build something custom.
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz · 0123456789
Instrument Serif
400 + italic
The full-stack software assembly.
Archivo
Variable 100–900
Build something custom.
Space Mono
400 / 700
SELECTED WORK / VISUAL IDENTITY / 01
Press Start 2P
400 · Pixel accents
CUSTOM SOFTWARE
A system
in use.
Actions, labels, and surfaces working together. These are visual specimens of the interface language.
Mesa Assembly / Interface study
Build something custom.
Direct, curious, and conversational. Let the work speak, with short parenthetical asides used sparingly.
Keep it
recognizable.
Direct, curious, and conversational. Let the work speak, with short parenthetical asides used sparingly.
- 01
Keep the visual language flat
Use cream, ink, and one Mesa Orange accent. Build hierarchy with scale, space, and contrast. Avoid gradients, shadows, blur, and parallax.
- 02
Give each typeface a job
Instrument Serif leads; Archivo supports; Space Mono labels. Press Start 2P belongs to rotating headline words and the marquee, with zero tracking.
- 03
Make motion considerate
Keep the roll-label hover consistent and respect reduced motion. Reserve curtain red for page transitions.
Adapted from the brand guide on Jarin.dev and aligned with Mesa’s current orange accent and pixel typography. This edition adds coordinated light, dark, and orange logo treatments.
View original on jarin.dev ↗