Inspiratie

My inspiration board, explained by Claude

A board for screenshots of websites I like. Claude looks at every screenshot, writes down why it works and files it under a style group. Through its own MCP server, Claude can then use the board while designing.

inspiratie.gerbenput.com

Node.js · Express · PostgreSQL · sharp · Anthropic API · MCP · Docker

Inspiratie: Screenshot of the live site — Scroll: this is the real site

The story

The idea

When I see a beautiful site, I take a screenshot. Those used to vanish into a folder. Now every screenshot gets an explanation and a style group, and when I start a new design I can say: make it like that one.

The design

A risograph zine in cobalt blue and fluorescent pink on grainy paper: heavy condensed headings, tilted stamps on the cards and an edit view shaped like an open book.

Under the hood

Uploads are resized with sharp and stored as WebP in PostgreSQL. Claude analyses them one at a time with a fixed answer format. A custom MCP server without an SDK gives Claude read-only access.

The board by style group, with stamps and colours (sample screenshots)
A screenshot with Claude’s explanation, as an open book
Signing in, with the risograph illustration

In detail

Drag or paste: Drag, paste with Ctrl+V or pick screenshots, with a source and a note of my own.
Explained by Claude: Title, colours, typography, layout and what it is useful for.
Style groups: Claude reuses existing groups, so the board stays organised.
MCP server: Fetch styles, screenshots and the full page in parts, read-only.
Export: The whole board or a single style group as Markdown for Claude.
Secure: One password, a token that can only read and a limit on failed attempts.

Next project DroneAI A pre-flight briefing for your drone