HEX // OS · SELECT A FACE

HEX

Film · Design · AI. A production company built as a geometric operating system.

BRAND SYSTEM · v1.0 · LOS ANGELES

DOWNLOAD PDF ↓
HEX // IDEA

The machine
and the work

HEX is a film production company presented as an operating system. The interface is thin and mechanical; the footage and the craft are the payload. One hexagon, one wordmark discipline, orange as heat and mass — a system that reads instantly and gets out of the way.

01 Work first

Footage and craft lead. Chrome stays thin.

02 Geometric modernism

One mark family, one wordmark discipline, poster energy.

03 Hex is the system

Face, closed, and isometric hex each carry a distinct job.

04 Heat & grain

Orange carries energy as body. Film grain is production DNA.

HEX // COLOR

Warm void,
one heat

Two schemes share the same roles. Void Portal is the default — a warm near-black, cream ink, one live orange used as mass. Bone & Embers is the light counterpart. One chromatic accent per theme. Never a second brand hue, never pure black, never glass.

Void Portal · default · 3 × 2

Void#0e0d0bGround · warm near-black, never pure #000
Surface#181612Cards · raised chrome
Ink#e8e2d2Primary text · cream, not white
Muted#8d8775Secondary text
Faint#5a5449Tertiary · quiet meta
Orange#ff6b1aThe accent · fills, arms, heat, mass

Special · live dot

REC#ff3b1aLive-dot only · never body fill

Bone & Embers · light · 3 × 2

Bone#f0ebe1Ground · bone paper
Surface#fff9f0Cards · chips
Ink#12100eNear-void type
Muted#6b6458Secondary
Faint#9a9184Tertiary · quiet meta
Ember#e85d04The accent · same job as orange
HEX // TYPE

Three voices,
one system

HEX
Monument ExtendedDisplay · heroes, specimen, key titles. Wide, mechanical, used with restraint.
Aa Bb Cc — the quiet body that carries paragraphs and UI.
OutfitBody / UI · paragraphs and interface. Neutral, legible.
HEX // OS · 01–06 · 18:14:28
Chakra PetchReadout · system voice, codes, clock. Short strings only, never body.
HEX // MARK

The HexMark

One hexagon with three cube-spokes — the closed hex read corner-on. It holds from a 16px favicon to a poster seal. Clear space is one cap-height of the wordmark on every side. Never soften the corners, never add a second lobe, never swap the geometry. Primary mark downloads live in HEX // LOGO above.

Mark flips · 2 × 2

Cream on voidDefault lockup ground
Void on orangeHeat tile · avatars, headers
Orange on creamPrint / light footage
Solid sealKnockout spokes · reads at 26px

Avatars · 2 × 2

A1 · WireframeQuiet, technical
A2 · Heat fieldRecommended
A3 · Solid sealReads at 26px
A4 · MonogramMonument H
HEX // WORDMARK

Lockups
& the voice line

The wordmark is HEX in Monument. The system speaks as HEX // ___ — two slashes, always spaced, never glued. The word after the slashes names the channel or mode. Primary logo downloads live in HEX // LOGO above; this section is lockup experiments.

HEX // FILM

Lockup studies · 4 × 2

Horizontal
Stacked
Voice line
Mass underline
Bookends
Spine
Ticker rail
Negative tileTrue knockout
HEX // VOICE

System readout

Lean, confident, production-minded. The system idles as HEX // OS · SELECT A FACE. Craft copy stays short and clear. No SaaS hype, no agent banter.

HEX // OSHEX // WORKHEX // FILMHEX // AIHEX // CONTACTHEX // ON SET
HEX // ICONS

System glyphs

Closed-hex frame, one orange glyph. Built on the mark geometry, SVG + PNG.

Glyph set · 5 × 2

WORK
PLAY
REC
SIGNAL
ROUTE
CONTACT
ARCHIVE
CUT
GRAIN
AI
HEX // MOTION

The machine
in motion

Motion is the machine speaking: mechanical, geometric, heat as mass. Six verbs, two eases, one accent. Below: the verb bench, rollover studies, mark studies, the field, and hex-as-information.

01

ARM

The pointer touches a control

HOVER A ROW

DURATION
240ms · T2
EASE
EXPO-OUT
APPLIES TO
Segments · rows · controls

Leader draws, index heats, label seats. One idea per hover. Nothing moves layout.

A

Pill square

HOVER

Rests as a pill; attention squares the top-left and bottom-right corners. The diagonal asymmetry is the move. 320ms · expo-out. Note: a resting pill breaks the radius-0 law, so this stays a study unless the law bends.

B

Chamfer

HOVER

The brand-legal translation: rests square, attention chamfers the same two corners at the hexagon's own 45° and floods orange. The chip becomes a fragment of the mark. 320ms · expo-out.

C

Bracket card

HOVER / FOCUS

Faithful port of the Tokyo Midnight BracketCard: quiet hairline at rest; on hover or keyboard focus, squared 1px brackets grow 9 → 18px at top-left / bottom-right, the card lifts 2px, the border warms. Frames are earned. In HEX the card is already square, so the reward is heat, not shape tension. 400ms · expo-out.

D

Hex tiles

HOVER

FLOOD Heat rises from the base edge; language flips to ground.

TRACE The perimeter draws in orange. Attention is drawn, literally.

BRACKET The Tokyo Midnight corners land on the hexagon's own vertices.

INSET A second frame seats inside. Clear space made visible.

IRIS The aperture closes from all six edges to frame the label.

KEY A mechanical press onto the hard offset edge. Radius-0 physics.

The rollover happens inside the mark's own geometry: same pointy-top hexagon as the live HexMark. Candidates for archive cells, face buttons, and anywhere the honeycomb becomes navigation. All pure CSS · 320–500ms · expo-out.

S3GYROLOOP · 120° RATCHET
S5CHASELOOP · PROGRESS
S6BREATHEAMBIENT · 5s

The live baseline: a sea of dots below a breathing horizon line. Portal home (live today)

Six axes, one geometry. A job's production profile drawn on the mark itself: deck covers, archive cards, wrap reports.

72 / 72 JOBS

HOVER A CELL

03/06SHOOT

The same instrument that routes the site reports a job's state: six phases on six segments. Loaders, status boards, delivery emails.

OR TAP A SEGMENT TO SET PHASE

HEX // APPLICATIONS

The brand
in the world

Editable, exportable templates. Previews are the exact file you download.

Social posts · 3 × 2

New Work
Director announcement
On set
Voice
Story
LinkedIn post

Motion · looping GIFs · 4 × 2

New Work
New Work · drop
New Work · glitch
Director
Logo morph
Job state
Wordmark glitch
Signal acquired

Collateral · 2 × 2

LinkedIn banner
Deck cover
Card · front
Card · back

Footage overlays · 3 × 2

Premiere · 1:1
Specimen · 1:1
End card · 16:9
Lower third · 16:9
Viewfinder story · 9:16
Wrap credits · 9:16

Stamps & seals · 2 × 2

Delivery stampMasters, PDFs, invoices
Slate badgeDailies, review links
Final cutLocked edits
Founding sealMerch, end papers
HEX // END OF LINEBRAND SYSTEM v1.0 · LOS ANGELES