Camo Art Book, kept readable.
The palette below is read from website/css/tokens.css. The page is a design reference, but the source of truth is still the CSS token system and the checks that guard it.
Rules
- Canonical crimson is --c-accent. Use it for the monogram, watermark, focus accents, and larger brand marks.
- Small labels over camo use high-contrast cream text with crimson ticks or rules. Do not create black highlight patches just to make red text pass.
- If red text fails contrast, adjust surface, placement, type size, or convert it to a crimson graphic accent before changing the brand hue.
- Native all-caps labels use --mono-label-xs or --mono-label-sm. Anything smaller is a bug unless it is decorative.
- Light mode uses deep crimson ink, not the hot red treatment built for dark textured fields.
Specimen
A compact proof of the brand stack: Cambridge display, Figure body copy, Native labels, crimson accents, and camo texture.
Billy Bunn
Backend and platform software.
Software engineer building services, migrations, internal tools, and the pieces around them that make the work easier to change later.
Brand Palette
The visible palette is intentionally narrow: two field colors and one crimson family. Semantic aliases and glitch channels are documented separately so they do not read as extra brand colors.
Field colors
The dark camo field and the light paper field.
- Deep field
--c-bg-deep#15130F dark camo page field - Paper
--c-paper#F1EDE4 light camo page field
Crimson family
One brand hue family with role-specific treatments for scale, state, and contrast.
- Canonical crimson
--c-accent#A8201A brand mark, watermark, primary accent - Hot crimson
--c-accent-hot#E7403C hover and focus lift - Readable red
--c-accent-readable#FF4B3F small accent text over protected dark texture - Deep crimson
--c-accent-dim#7A140D light theme readable accent
Theme Semantics
Theme-facing aliases. These should follow the brand palette, not expand it.
- Dark background
--bgvar(--c-bg-deep) → #15130F default page field- Dark text
--text#EDE4D6 primary reading color- Dark muted text
--text-mutedrgba(237, 228, 214, 0.72) secondary prose- Dark accent
--accentvar(--c-accent) → #A8201A canonical crimson- Dark readable red
--accent-readablevar(--c-accent-readable) → #FF4B3F small red labels- Dark chrome field
--chrome-bgrgba(20, 18, 15, 0.56) readability field behind page chrome- Light background
--bgvar(--c-paper) → #F1EDE4 paper field- Light text
--text#2A241E primary reading color- Light accent
--accentvar(--c-accent-dim) → #7A140D deep crimson- Light readable accent
--accent-readable#4F0B07 small labels on paper
Effect Channels
Glitch RGB channels are effects for the mark and watermark, not content colors.
- RGB red
--c-rgb-r#FF1F3D brand-mark and watermark glitch channel- RGB green
--c-rgb-g#00FF8C brand-mark and watermark glitch channel- RGB blue
--c-rgb-b#1FB4FF brand-mark and watermark glitch channel
Typography
Fort Foundry faces stay mapped to specific jobs so the site does not drift into generic portfolio typography.
Billy Bunn
Display titles and the primary nameplate.
Use at hero and section-heading sizes only; keep letter-spacing at 0.
Make the work easier to change later.
Editorial accents and italic moments.
Use sparingly so the site keeps its field-manual discipline.
I build backend and platform software for systems people actually have to run.
Body copy, resume copy, and readable explanatory text.
Use fluid Utopia steps from font-scale.css for prose.
NORTHERN CALIFORNIA · REMOTE WORK · MMXXVI
Navigation, labels, captions, terminal-like metadata.
Use --mono-label-xs or --mono-label-sm; never freehand tiny all-caps sizes.
Quality Gates
Brand and accessibility checks are separate on purpose: the site has to pass both.
npm run check:brand- Locks the canonical palette and blocks the old pink readable-red value.
npm run check:visual-contrast- Samples rendered text against camo, watermark, chrome, and cursor-reveal states.
npm run check:a11y- Runs axe-core across public and hidden proof routes after the production build.