Roast My Design System MCP server

roast-my-design-system

Your AI can write the UI. This makes sure it writes your UI.

A free CLI tool, and a Claude Code plugin with two skills and a bundled local MCP server, that roasts your repo's design system with real data, reviews what you change against it, and generates the rules that keep your AI agent on-system.

New in 8.0: support for the four big component kits.

If your product is built on MUI, Mantine, Chakra UI or Ant Design, roast now reads it as such. It finds your theme in the repo, counts how often your components read it, and measures the two things that drift: colours and spacing written onto components when the theme already has a value.

- The kit's own code is not counted. Nor are chart colours, colour pickers, artwork, editor themes or fallbacks.

- Your own layer counts as the kit. Metabase wraps Mantine and imports the wrapper in 2,469 files. The old reading covered 14% of the product.

- A repo belongs to the kit it uses most, shadcn included.

- You are compared with products on the same kit: 19 MUI, 19 Mantine, 16 Chakra and 16 Ant Design, 70 in all. Each target comes from the tidiest third of its group.

- The fix prompts speak your kit: MUI's sx, Mantine's props, Chakra's space steps, Ant Design's theme.useToken().

Repos that used to fall through now read properly. Open-Assistant scored a false 100 and now scores 75 as a Chakra product. InvenTree and the APISIX dashboard got no score at all and now score 75 and 84.

Also in 8.0: eleven counting fixes.

The benchmark is rebuilt on them, so every score moves. Take a fresh one before you compare.

- One colour written two ways is one colour. It was counted twice and reported as a near-identical pair.

- A fallback inside var(--x, #fefefe) reads the theme. It is no longer a stray colour. Primer goes from 308 colours to 8.

- Stylesheets you did not write are left out. So are apps you have replaced, such as a web-old folder. The report lists everything left out, with file counts.

- Fix prompts start from a product file, not from your docs site.

Fleet medians are now 115 colours, 23 greys, 33 off-scale spacing values, 21 duplicated components, 51 inline style blocks, 77 bracket values, 7 near-identical pairs and 5 !important.

Shortened. The full README is on GitHub.