const peterBenoit = {
title: "Front End Developer",
agency: "U.S. Department of Veterans Affairs",
contract: "Peraton · MVP Platform",
location: "Ocala, Florida",
experience: "20+ years front-end",
federal: ["CDC", "VA"] /* and counting */,
impact: "9M+ veterans · 330M Americans · ~1,000 govt sites",
currentStack: ["React", "Next.js", "TypeScript", "USWDS", "VA Design System", "Tailwind"],
sidequests: ["open source", "CSS writing", "trail photography"],
irl: {
camera: "Lumix FZ80D",
trails: "Ocala National Forest",
dog: "Bowie",
},
} as const;→ VA MVP Platform — modernizing veteran-facing digital services at the U.S. Department of Veterans Affairs. React, Next.js, USWDS, Storybook. Serving 9M+ veterans.
→ Open source tooling — tailwindcss-hue-theme, RepoWidget, ResourceLoader.js, and a few other things I built because I needed them.
→ Writing about CSS — particularly the newer stuff that doesn't get enough attention yet.
16 years at CDC maintaining the design system and component library that powers every page on CDC.gov. Then OPHDST. Now VA. I go where the infrastructure needs building.
| Metric | Number |
|---|---|
| Years in federal front-end | 20+ |
| Federal agencies | CDC, VA |
| CDC sites on the template system | ~1,000 |
| Americans reached during COVID (CDC) | 330M |
| Veterans on the platform I work on now | 9M+ |
| W³ Awards (2024) | Gold + Silver |
| Section 508 compliance | always |
| Project | What it does |
|---|---|
| tailwindcss-hue-theme | OKLCH-powered Tailwind plugin — one CSS variable shifts your entire color palette |
| ResourceLoader.js | Async script/style loader with dependency management and caching |
| StorageManager.js | Web Storage wrapper with compression, TTL, and namespacing |
| RepoWidget | Drop-in GitHub repo cards — no backend, no API key |
| ImageProcessor | Browser-based image resizing, cropping, and format conversion |
| EmbedManager | Lazy-loads YouTube, CodePen, and Maps embeds with consent fallbacks |
| tailwindcss-visibility | Content-visibility utilities for Tailwind |
| reQuery | Reactive state and DOM binding for jQuery — no build step |
Mostly CSS features that aren't getting enough attention yet. Occasionally a trail report.
- color-mix() in CSS — practical uses beyond just tinting
- @starting-style — entry animations without JavaScript
- Scroll-driven animations — what's actually useful today
- Marshall Swamp Trail — Ocala flatwoods, spring morning
peterbenoit.com · LinkedIn · CodePen · npm · vscode