Audit CSS with MDN-backed browser checks

An MCP add-on let Claude Code look up MDN guidance and browser support while reviewing CSS for likely issues.

Done with Claude Code· Intermediate

What they did
They installed an MCP server through an npx command and connected it with Claude Code, VS Code, or a similar client. From there, the agent could fetch MDN documentation for a CSS feature, read browser compatibility data, and scan either pasted styles or a project’s built CSS output. They could request a short summary by default by asking in normal language.
How it went
The README did not show a real-world deployment. It did mention rough speed numbers: initial lookups landed around 400-500ms, while cached ones were about 100ms. A summary run used roughly 1-2k tokens, and the full 150+ metric mode could use 10k+ tokens.
Tips
Use the default summary mode unless you specifically need the full metric report. You’ll need Node 20+ and native build tools so the SQLite cache can work.

Try it yourself with Claude Code

Look over [path to CSS file or pasted CSS] and compare any doubtful properties or features with MDN guidance and browser support for [browser targets]. Point out anything that may not work, anything redundant, and anything that should fall back to a safer option, then explain each suggested edit. Before any step that would send, delete, submit, or overwrite something, stop and ask for my approval. End with a brief compatibility note that separates safe-to-ship changes from items that still need a fallback.

Fill in the [brackets]. Agents can make mistakes, so review anything before it is sent, paid or deleted.

Read the original on github.com ↗

Get 3 agent uses like this every morning

With the day's top AI news. Free, and one click to unsubscribe.