PROTOCOL FOUR// field manual
FieldField Manual
SystemsSystems
AssetsAssets
Field Manual / Assets

The kit

Color tokens, typography, minerals, and iconography. Everything you'd need to draw a new Protocol Four screen and have it look like it belongs.

01 · Palette

background#171813

Every screen's canvas. Near-black with a green tint.

foreground#FAFAF8

Primary text and high-contrast surfaces.

primary#F3F3EA

Buttons and primary CTAs on dark backgrounds.

secondary#7A7A6F

Muted text — tab labels, secondary captions.

muted#A9A99B

Body copy on dark; mid-contrast captions.

card#1E1F1C

Card and surface backgrounds, one step above background.

border#44453F

Hairline dividers and outlined controls.

surface#2A2B23

Subtle surface elevations.

sage#C9D3B4

Success — 'all done' day status, positive deltas.

highlight#ACCA6D

Active state — running timer, in-progress goals.

progress#A7A36B

Olivium / progress / docs accent.

star#D4A843

Accolades — agent profile stars, milestones.

error#D95755

Destructive — delete, negative deltas.

snow#FBFBFB

Pure white for emphasis on dark backgrounds.

olive#696B47

Tag color — clubs, mission categories.

checkpoint#C8C7B7

Checkpoint markers — neutral milestone tone.

02 · Typography

Instrument SerifDisplay / Serif
The mission always comes first.

Headlines, mission text, every moment that needs gravity. Italic for soft emphasis.

Funnel DisplayDisplay / Sans
PROTOCOL FOUR

Marketing display type on the field manual; bold tracking-tight headlines.

DM SansBody
Three doors, one identity.

All body copy in the app. Comfortable reading at small sizes.

IBM Plex MonoMono / Code
AGENT 0086BBUL

Agent codes, mineral counters, statuses, every uppercase tag.

03 · Minerals

Olivium
Spendable

The primary mineral. Funds breaks; pays club join costs.

Ruby
Identity

Earned on hard-won milestones. Accumulates as a profile signal.

Emerald
Identity

Earned through consistency. Slowest to grow, hardest to lose.

Sapphire
Identity

Earned through deep work — long focus sessions, multi-hour goals.

04 · Iconography

All icons are hand-built SVGs in `components/icons/` so the line weight and silhouette stay consistent. No third-party icon library.

MissionsIcon
WorldIcon
YouIcon
SettingsIcon
DownCaretIcon
RightCaretIcon
ActiveIcon
LockedIcon
DistractionsIcon
SensesIcon
NotificationsBell
StarAvatar
BackArrow
FrontArrow
16 TOKENS · 4 FONTS · 4 MINERALS · 14 ICONS