Identity System · v1.0 · 2026

Brand
Guidelines.

The visual and verbal system behind ZAYN.ALE. Use this as a reference when placing the mark, picking type, or writing in the brand voice — whether internally, with partners, or in client deliverables.

02
The Palette

Color
System

One signal color, one deep ground, four neutrals. The brand runs hot and quiet at once — Ember provides the energy, deep charcoals carry the weight. Restraint is the rule: color is the loudest tool we have, so we save it for the moments that matter.

Primary · Brand
Ember
HEX
#FF6B35
RGB
255 · 107 · 53
HSL
16 · 100 · 60
OKLCH
0.71 · 0.18 · 41
CMYK
0 · 58 · 79 · 0
Pantone
165 C

What It
Means

Ember is the brand. It signals the moments of momentum, attention, and action — the spark you want a visitor's eye to land on. Used sparingly, it always means “this matters.” Used everywhere, it means nothing.

Hot, kinetic, confident. The orange of fire-edge metal, of late-evening sun on brick, of a single line of unread mail.

KineticConfidentWarmPreciseAlive

Ember Scale — for tints, hovers, fills, overlays

50#FFF1EA
100#FFD9C4
200#FFB593
300#FF8F5E
400#FF6B35
500#F04E14
700#962D06

Neutrals & Surfaces

Carbon

Background · Base
#08090B
8 · 9 · 11

Slate

Surface · Layer 2
#0D1117
13 · 17 · 23

Ash

Surface · Layer 3
#111820
17 · 24 · 32

Smoke

Body Text · Mid
#8A9AB0
138 · 154 · 176

Bone

Display Text · Primary
#EEF2F6
238 · 242 · 246

Usage Ratio — a rule of thumb

70%Carbon · Ground
22%Slate · Layer
8%Ember · Signal
03
The Typeface

Typography

Three families, three jobs. Bebas Neue does the heavy lifting on display. DM Sans is the body voice. Space Mono carries the engineering labels — the small caps that make the work feel measured, technical, and real.

DisplayHeadlines · Marks

Bebas
Neue

High-impact condensed sans for the moments you want to shout. All-caps by default. One weight, one purpose: to be remembered.

Weight
400 / Regular
License
OFL (Free)
Use
Display only
Min size
22 px
SHIP FAST.
BUILD TO LAST.
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
0 1 2 3 4 5 6 7 8 9 · & ! ? @ #
BodyUI · Long-form

DM Sans

A geometric sans designed for screens. Pairs cleanly under Bebas Neue and reads comfortably at every size, from 12px caption to 24px lead.

Weights
300 · 400 · 500 · 600
License
OFL (Free)
Use
Body · UI
Default
16 px / 1.65

The best code is the code I didn't write— every line is a future bug, a future invoice, a future onboarding pain.”

Web development and AI automation for founders, studios, and agencies who ship fast and build to last. Five years in, fifty-plus projects, one operator. Working with founders who want a senior engineer in their corner without the overhead of an agency.

MonoLabels · Metadata

Space
Mono

The voice of the engineer in the room. Used for labels, eyebrows, captions, code, and anything that should feel measured or precise.

Weights
400 · 700
License
OFL (Free)
Use
Labels · Meta
Default
10–13 px, +14% letter-spacing
[ AVAILABLE · BOOKING Q3 2026 ]

01 — WHAT I DO
02 — HOW IT WORKS
03 — RECENT WORK
04 — CLIENT WORDS

STATUS: 200 OK
RESPONSE TIME: < 48H

Type Scale

Display XL96–176 px0.9Ship Fast.
Display L56–88 px0.95Section Title
Display M28–40 px1.0Service Title
Lead18–21 px1.55Intro paragraph copy that sets up a section with measured warmth.
Body15–16 px1.65Standard reading copy used for longer-form text and UI body content.
Small12–13 px1.7Supporting copy, captions, footnotes, and metadata details.
Mono Label9–11 px1.501 — Section Label
04
The Tone

Voice &
Tone

Direct, considered, slightly dry. We write like the senior engineer at a small firm: confident enough to skip the hype, honest enough to name what we don't do, and friendly enough that you'd want to share a coffee with us.

01

Plainspoken

Short sentences. Concrete nouns. No hype words, no "synergy," no "leveraging" anything. If a word would make a software developer wince, cut it. If a phrase only exists because we're afraid of silence, cut it twice.

02

Specific

Numbers, names, and time-bound claims always beat adjectives. "Saved twenty hours a week" lands. "Significantly improved efficiency" doesn't. Where possible, point at the receipts — clients, screenshots, repos.

03

Self-aware

Confident but never cocky. We name the things we won't do as clearly as the things we will. A small joke against ourselves is always allowed; a joke at the client's expense never is.

We Say
  • I ship in six weeks or I tell you why I can't.
  • You should hire me for this if your product is the website.
  • The best code is the code I didn't write.
  • If the math doesn't work, we stop.
  • Endings are part of the deliverable.
We Don't Say
  • Synergize cutting-edge solutions for tomorrow.
  • We empower world-class teams to unlock potential.
  • A passionate team of innovators & creatives.
  • Reach out today to elevate your digital presence.
  • 10x your business with the power of AI.
05
The Kit

Components

The building blocks. Use these patterns verbatim on the site, in proposals, and across any deliverable. New patterns are welcome — just keep the same rules: hairline borders, monospaced labels, Bebas headlines, single-point accents.

Buttons2 styles · 1 size
Labels & EyebrowsSpace Mono · 10–11 px
01 — What I Do
Recent Work
Available
Tags & ChipsMono · Hairline borders
Next.jsOpenAILiveFeatured
CardHairline border · 1px
01

Card Title

A short paragraph of supporting body copy goes here, written in DM Sans at our default body size.

Read More →
Form InputHairline underline · Focus = Ember
06
The Geometry

Grid &
Spacing

An 8-point baseline grid, a 12-column page grid, hairline dividers, and generous breathing room. White space carries weight. Stack content vertically and let it breathe; resist the urge to fill.

Spacing Scale

xs
8 PX
sm
16 PX
md
24 PX
lg
40 PX
xl
64 PX
2xl
96 PX

Container & Layout

12-Column Grid · Max-Width 1320 PX · Gutter 40 PX
Span 6 · Half Width
Span 6 · Half Width
Span 4 · Third
Span 4 · Third
Span 4 · Third

Brand Kit

Logo files, color tokens, font specimens, and this guide as a PDF. Updated whenever the system shifts — usually quarterly. Currently v1.0.

Download Kit · v1.0 ↗