Anti-AI Hand-Drawn · 2026 Design Direction

section two ↓ typography (warm humanist + real handwriting)

Three-typeface model

For high-stakes work, commission three custom faces (one per principal/voice). The BBH model. Below: warm humanist display + real hand-script + warm-italic body. Never Google Fonts handwriting (defeats the posture — the brief bans Caveat, Indie Flower, etc. by name).

Moodboard substitution discipline The brief bans Google Fonts handwriting faces by name (Caveat, Indie Flower, etc.) because they defeat the cultural posture. Production builds commission real hand-lettering or scan ink work. This moodboard uses Fraunces (humanist display, OPTICAL-SIZE + SOFT + WONK variable axes) and italic Crimson Pro as proxies; the "handwritten" specimen below is an inline SVG hand-drawn path, not a typeface. The discipline of the substitution itself demonstrates the rule.

Principal: Founder #1

Fraunces · Display 900

Principal: Founder #2

SVG hand-drawn · proxy for commissioned ink

Principal: Founder #3

Crimson Pro · Italic 500

display 88pt

Built by people.

handwritten

— for everyone, not against the algorithm

body 19pt

The mark is hand-drawn every time. Never vectorized smoothly. Onion-skin animation reveal. The human gesture is the design — the imperfection is the message. no Caveat fakery → commission real lettering or scan it from real ink.

section three ↓ Matisse cut-outs

Organic shapes, hand-cut

Solid-color organic shapes acting as page graphics. Slightly rotated. Deliberate paper-edge texture. Casi by Templo built its identity from these. Hover the shapes — they tilt back like real paper.

Coral fragment

Leaf form

Marker bloom

Smile cutout

section four ↓ highlighter strokes

Animated marker emphasis

Hover the link below. The stroke draws across with slight wobble — like a real highlighter under a real hand. Built with CSS background-size transition. click me to see the stroke · simple, physical, 220ms ease-out. Never use animated underlines that feel mechanical. Never use box-shadow as a fake highlighter. Use a real gradient that grows from left.

section five ↓ five signature moves

Recognizable patterns

sig 1 →

Hand-drawn primary mark

Central logo HAND-DRAWN every time. Never vectorized smoothly. Onion-skin animation reveal (4-6 frames, imperfect timing).

sig 2 →

Matisse cut-out compositions

Solid-color organic shapes with deliberate paper-edge texture, slight rotation. Casi reference. Page graphics, not decorative ornament.

sig 3 →

Photocopy / xerox bg textures

Sections have subtle xerox-noise overlay (10% opacity grain). The page has been COPIED — the texture is part of the message.

sig 4 →

Highlighter-stroke links

Animated marker stroke (slight wobble, alpha falloff). Like a real highlighter under a real hand. Never CSS box-shadow.

sig 5 →

Three custom typefaces (high-stakes variant)

For top-tier projects, commission 3 bespoke faces representing the project's principals/voices. The BBH model. Each face IS a person. three voices, three faces, one identity

section six ↓ what NOT to do

Anti-patterns

✕Google Fonts handwriting (Caveat, Indie Flower) — defeats the entire posture

✕AI-generated illustrations — defeats the entire posture (this is the whole point)

✕Smooth digital-vector marks (use hand-drawn raster or scanned)

✕Drop shadows or glassmorphism (anachronistic to hand-craft)

✕Pure-saturation digital RGB primaries — use period-mixed pigments

✕Identical animation loops — every animation must have 2-5% random variation

✕"Hand-drawn aesthetic" where the actual marks were Photoshop-vectorized — must be REAL ink/pencil/marker. if it doesn't smell like graphite, it's faking it