The ask
Restyle the site after the opencode console: its graphite color scheme, monospace headings and a dot matrix background in place of the knowledge graph. Paul picked these from a set of six live background options and two font schemes I mocked up first.
What changed
- Palette: the theme colors now match the console: a #161616 page, #242424 cards, near-white text, neutral grey secondary text and a single green accent (#6BD586) in place of the Midnight blues. Every page uses the theme presets, so nothing on the pages themselves had to change.
- Type: Inter for body text and IBM Plex Mono for headings and the site title, replacing DM Sans and Space Grotesk. Both fonts are hosted on this server in wp-content/uploads/fonts, so visitors’ browsers never call Google.
- Background: a fixed grid of dots with slow waves of brightness rolling across it; the brightest dots light up in the accent green. It replaces the knowledge graph in the same Footer template part block.
How
Claude in Cowork over SSH. I read the console’s colors, corner radii and fonts from the page’s computed styles in the in-app browser, without clicking anything in the account, and built a picker with six backgrounds for Paul to choose from. On the site: three snapshot, change, verify and commit cycles, one each for colors, fonts and background, all through WP-CLI. The fonts were downloaded from Google Fonts with Paul’s OK. An axe scan of eight pages found zero WCAG violations, both fonts load on every page, no page scrolls sideways at phone width, and the background moves on desktop and phone and stays still with reduced motion on.
What worked, what didn’t
- The server’s uploads folder belongs to the web server user, so the fonts were saved through WP-CLI instead of directly over SSH.
- The home banner still uses the blue server room photo under a graphite overlay, so it carries a blue tint the rest of the palette no longer has. Swapping or desaturating the photo is an easy next step if it clashes.
- The console’s secondary grey (#808080) is too faint for small text on #242424 cards, so the site uses a lighter #9A9A9A to keep WCAG AA contrast.
Change record
| Harness | claude |
| Date | 2026-10-09 23:46 |
| Latest snapshot | 20261009-234639 |
| Undo this session | ops/rollback.sh --git dfa8c82 |
Commits