What AI slop looks like.
It is not ugliness. It is a screen assembled out of defaults, and every default has a name. The screen above marks its defects as the sweep passes them; here is each one on its own — what an agent writes on the left, what replaces it on the right — and one the screen above has no room for.
One way to separate, not three.
A card is told apart from the page by its colour, or by a stroke, or by a shadow. Machine-made UI reaches for all three at once and every edge in the interface gets loud.
Slop
Payment received
The plan renews on the tenth of every month.
fill + stroke + shadow
Fixed
Payment received
The plan renews on the tenth of every month.
fill
The corner follows the height.
9999 pixels is not a decision, it is a default — and it makes a 36px control and a 44px control the same shape. Half the height reads as deliberate; a fixed pill reads as nobody looked.
Slop
Save changesDraft36px and 28px, both 9999
Fixed
Draft36px → 10, 28px → 8
Focus is a border, not a halo.
A glow sitting on a resting control is decoration: it says nothing, and when the control really is focused it has nothing left to say. A border that appears only on focus is information.
Slop
name@company.comContinuea halo at rest, on both
Fixed
click in — the border is the focus
A label is a sentence.
Ten-pixel capitals spaced out like a fashion house are the cheapest tell of a generated screen, and the hardest thing on it to read. Set the label in the same voice as the text under it.
Slop
Recent activity
Three runs finished this week.
10px, tracked 0.18em, capitals
Fixed
Recent activity
Three runs finished this week.
14px, the body face
No gradient, no coloured stripe.
A two-colour wash across a button and a bar down the left edge of a notice are the two ornaments an agent adds when it has nothing to say. Neither carries meaning; both cost contrast.
Slop
Upgrade nowYour plan renews in four days.a wash, and a rule down the side
Fixed
Your plan renews in four days.one fill each
If you cannot name the source, do not print it.
Invented quotes, invented stars, invented counts. An agent writes them because the layout has a slot for them, and every one of them is a lie a person has to answer for later.
Slop
★★★★★
“It completely transformed our workflow. We shipped 3× faster in the first week.”
— Sarah M., Head of Design
trusted by 10,000+ teams
Fixed
A generated pack ships 44 components for a web app, 50 for a phone and 52 for a website — every variant and every state.
counted from the engine's own catalogues
Broom has no customers to quote yet, so this page quotes none. The row above is the reason: a testimonial nobody said is the same failure as a gradient nobody chose.
What an audit hands back.
Point Broom at a product that is already live and the first thing you get is not a design — it is a reading of the one you have. Then the rules that keep it from slipping back.
A score, and the band it falls in
- Clean
- 0 – 3
- nothing generic to speak of
- Light
- 3 – 10
- a few generic patterns
- Noticeable
- 10 – 20
- generic patterns across the product
- Heavy
- 20+
- the interface reads as generated
The number is findings per thousand lines, weighted, so a small file with three of them would read worse than it is. The count and the lines it was measured over are printed beside it for exactly that reason.
A finding is four things
The file, the line, what is on it, and what goes there instead. Not a grade and not an opinion — somewhere your editor can open.
src/components/card.tsx:42
a fill, a stroke and a shadow on one card
keep the fill
The shape of a line, not a reading of anybody's code.
And one of your own screens, rebuilt
The run takes a real screen out of your repository, builds it again with the system it found in your product, and puts the two side by side — then measures the new one, so the claim that it is better is a number and not a feeling.
Two numbers we can stand behind
The code Broom generates scores 0 against this check; that is an assertion in our own test suite rather than a boast. On a public repository with 7,727 lines of interface code, a run we made while building Broom found 59 things and scored 11.0.
Three ways in.
Which one you take depends on how much of your product already exists. All three end in files your coding agent reads before it writes a line of interface.
Design from scratch
No design yet. We create the look and the rules for your agent.
You bring
A few answers about what you are building and who it is for — or a deck of real product designs you swipe through, and we read your taste off the ones you keep.
You get back
A system invented for that product: tokens light and dark, components in your stack, a page per component, and the skills.
Figma handoff
Your design is ready in Figma. We turn it into rules for your agent.
You bring
The Figma file itself, not a link. Your browser opens it and sends us only the document inside — the images in it never leave your machine.
You get back
The system that is already in the file, written down: its variables and their modes, its styles, its components, and the rules your agent needs to build with them.
I have a product
Your product is already live. We remove the AI slop or redesign it.
You bring
Your repository or your Figma file — at least one, so there is something real to work from. Then pick: a full redesign, or just remove the AI slop.
You get back
A redesign starts from what exists and why it fails. A slop removal keeps your system, finds where the code drifts away from it, and names the file and the line.
How it works.
No call, no onboarding, no workshop. You give it something real, it gives you files.
- 01
Point us at what exists.
Sign in with GitHub and pick a repository from your own list, private ones included, or paste a link, or upload the Figma file. If nothing exists yet, answer the brief instead.
- 02
We read it and measure it.
We download one archive of the default branch and read the files that build the interface — or decode the Figma document and count its variables, styles and components. Then we work out the system that is already there, and every place the code walks away from it toward a default.
- 03
You get the pack.
One zip, unzipped at the root of the repository. Components for your stack, tokens, a page per component, and the skills. None of your own code is touched: everything in it is new.
- 04
Your agent reads it before it writes UI.
CLAUDE.md, AGENTS.md and .cursorrules point at the skills; the skills are written in your product's own component names and numbers. The last one is a script, so the agent can check its own work before it says it is done.
Timed on our own runs, on the model the product uses: a Figma handoff finished in 8 seconds, a system written from a brief in 23, and a full audit of a repository in about 2.5 minutes. Your repository decides how close to those you land; we do not promise a number.
What lands in your repository.
One zip, unzipped at the root. None of your own code changes — everything here is new, and your agent reads it before it writes a line of interface.
components/your stack, every variant and stateButton.tsxDialog.tsxindex.tstokens/tokens.cssCSS variables, light and darktailwind.config.jstailwind.v4.csstokens.jsonW3C DTCGnative/tokens.dart · Tokens.swift · Tokens.ktdocs/components/one page per component.claude/skills/ledger-build/SKILL.mdledger-states/SKILL.mdledger-slop-check/detect.mjsruns on Node, no dependenciesDESIGN_SYSTEM.mdevery token value and the component indexfigma/README.mdthe tokens back into FigmaCLAUDE.mdAGENTS.md.cursorrules
ledger- is the only placeholder on this page: the skill folders carry your product's own name.
- Components, not snippets
- 44 for a web app · 50 for a mobile app · 52 for a website. Every variant, every state, the keyboard path and the accessibility attributes — rendered from one description of the system, so React, Vue, Svelte and React Native agree with each other.
- Tokens your code imports
- Light and dark, every text pairing checked against its background, as CSS variables, a Tailwind theme, W3C DTCG JSON, and the same values again in Dart, Swift and Kotlin.
- Skills your agent runs
- build · states · edge-cases · consistency · review · finish · slop-check, and one more for your product type. They are written in your product's own component names and numbers rather than in general advice, and the slop check is a script: your agent runs it on the files it changed before it calls a UI task finished.
- Yours to keep
- Everything in the pack is yours. Use it, change it, ship it, and sell what you build with it — there is no attribution line to carry and no licence to keep track of.
The stacks we render for.
Pick one and its components arrive as files. Pick more and the others land beside them, built from the same description of the system, so the React and the Swift agree on what a button is.
Components in code
Every component as a real file, with its variants, its states, its keyboard path and its accessibility attributes.
- React + Tailwind
- Next.js + Tailwind
- Vue
- Svelte
- React Native
Tokens, docs and specs
The tokens in the platform's own language, and a page per component describing every variant and state to build. Component code for these is coming.
- HTML + CSS
- Flutter
- SwiftUI
- Jetpack Compose
Pricing.
One run of any service is one analysis, and that is the only thing Broom counts. It comes off your balance when the run starts, and it comes back by itself if the run fails.
3 analyses free, so you can read what comes out before you pay for anything.
Starter
$30a month
10 analyses a month
$3.00 an analysis
Growth
$50a month
20 analyses a month
$2.50 an analysis
Pro
$100a month
50 analyses a month
$2.00 an analysis
Every plan includes
- Any of the three services: a system from a brief, a Figma handoff, a slop audit.
- Components, tokens, documentation and skills, for every stack you pick.
- Everything a run produces stays yours, and stays downloadable.
A plan renews every month and sets the balance back to its own amount: unused analyses do not roll over. Run out before the month does and one more analysis is $5, or move up a plan and the difference lands on your balance at once. Cancelling stops the next renewal, and the analyses that month already bought stay until it ends.
Start with 3 free analysesQuestions.
The answers below are the Privacy page and the Terms in fewer words. Where they disagree, those two are the ones that count.
What happens to my code?
We do not keep a copy of your repository. We download one archive of its default branch, hold the file text in memory while the run is going, and drop it when the run ends.
What stays on the result is what we found in it: the colours, fonts, sizes, corners, spacing and component names, the findings with the file and the line each one sits on, and short excerpts of the lines a finding points at.
A read-only token you paste to reach a private repository is used for the requests of that one call and then dropped. It is never written to the database, never logged, and never sent back to your browser.
Does Broom change my code?
No. Nothing in the pack overwrites anything you already have: the components, the tokens, the documentation and the skills are all new files. The one place they meet your repository is CLAUDE.md or AGENTS.md, and where one of those already exists you append ours to it rather than replace it.
Your agent is what changes your code, after it has read them, and that is still your commit to review.
Do you train on my data?
No. Not a model, not a fine-tune, not an evaluation set. Your code and your design do not make Broom better for anybody else.
One model does the writing: Google Gemini, called through Google Vertex AI in our own Google Cloud project. The deployed service calls no other model provider, and if that ever changes we say so on the Privacy page before it does. Google's own terms for Vertex AI say Google does not use what customers send to the service to train its models.
What if I already have a design system?
Then we keep it. Choose “Just remove AI slop” and Broom learns your system from the product itself and treats slop as drift away from it toward generic defaults — so a purple brand, a pill you chose on purpose or a blur you declared stays exactly as you decided.
The rules you get back name your tokens, your components and your numbers, with the import paths your code already uses.
Which stacks do you write code for?
React with Tailwind, Next.js with Tailwind, Vue, Svelte and React Native come out as component files — every variant, every state, the keyboard path and the accessibility attributes.
HTML with CSS, Flutter, SwiftUI and Jetpack Compose come out as tokens in the platform's own language, plus a page per component describing what to build. Pick more than one stack and the extra ones land beside the first, rendered from the same description of the system.
Who owns what comes out?
You do. The components, the tokens, the documentation, the skills, the rules files and the report are yours: use them, change them, ship them, and sell what you build with them. There is no attribution requirement and no licence to keep track of, and we make no claim on the product you build.
What stays ours is Broom itself — the engine, the taste behind it, the detector and the prompts. And the output is not unique to you: another customer with a similar brief may receive something similar, and we do not promise otherwise.
Can I cancel, and can I get a refund?
Any time. Dodo Payments is the seller of record, so cancelling a plan and changing a card happen in their customer portal, which you open from the billing screen. Cancelling stops the next renewal, and the analyses that month has already bought stay on your balance until the month ends.
For money back, write to support@broom.design within 14 days of the payment and we ask Dodo to make the refund. A run that fails costs nothing — its analysis returns to your balance by itself — but analyses you have already run are not refunded.
Where does my data sit, and how do I get rid of it?
The database is Firestore in Frankfurt and the API runs on Cloud Run in Belgium, both inside the European Union. Two things leave it: model calls go to Google's global endpoint, so a request may be served outside Europe, and the payment provider processes outside the EEA under its own terms.
Deleting your account runs a real cascade rather than setting a flag: your projects go, and with them their briefs, systems, versions and components, then your jobs, your payment records, your profile and the sign-in itself. One note survives, holding your account id and the date and nothing else, so that signing up again does not hand out the free trial a second time.
Can I use Broom where I live?
Everywhere except the European Economic Area, the United Kingdom and Switzerland. We ask which country you are in when you create an account and we do not open one for those.
That is about our own paperwork rather than about you: Broom is run today by one person rather than a company, and serving those countries properly asks for things a company is meant to carry. It is being set up. Write to support@broom.design and we will tell you when it opens.
Your agent is going to write the interface either way.
Give it your components, your tokens and your rules instead of its defaults. Point Broom at a repository, a Figma file, or nothing at all, and read what comes out.
3 analyses free, and nothing to pay until they run out.