Design linting: what automated checks can catch, and what needs a human eye
Design linting runs rules over a finished design or page and flags anything that breaks them: too many fonts, text below a size, contrast under a ratio, placeholder copy, links to nowhere. It's good at the measurable and the repetitive. It can't tell whether the page says the right thing to the right person, whether the photos are good, or whether the layout makes sense, so it supports a review rather than replacing one.
From code linters to design linters
The name comes from programming. Lint, a tool written at Bell Labs in the late 1970s, checked C programs for suspicious code that compiled but was likely to be wrong, and "linting" came to mean any automated check for known bad patterns. Design teams borrowed the idea as design files and front-end code grew large enough that nobody could review every screen by hand: plugins that flag colours not in the palette, text styles outside the type scale or spacing off the grid, and checks run on the built page itself.
What an automated design review can check
| Area | Example rule | Why it's reliable |
|---|---|---|
| Type | No more than one family or one pairing; body text at least 16px | Font names and sizes are in the CSS |
| Colour | Text contrast at least 4.5:1; only palette colours | Ratios can be calculated exactly |
| Tokens | No raw hex values outside the token file | A pattern search finds them |
| Content | No dummy Latin filler, 555 phone numbers or empty headings | Placeholders follow known patterns |
| Links | No empty or # links | Every href can be read |
| Images | Every image has alt text | The attribute is present or not |
| Motion | Animations respect reduced motion; no default easing | The CSS either has the rule or doesn't |
| Known habits | No purple-to-blue gradient; no emoji used as icons | Specific patterns can be matched |
The common thread is that each rule has a yes-or-no answer in the code. Where that holds, a linter is faster and more consistent than a person, and it runs on every change instead of once before launch.
What still needs a human eye
- Whether the message is right. A headline can pass every rule and still not say what the business does.
- Whether alt text is good. A linter sees that alt text exists, not whether "image1" describes the photo.
- Hierarchy and flow. Whether the eye lands on the right thing first, and whether sections come in a sensible order.
- Photography and illustration quality, cropping and whether the images show the real business.
- Contrast over images and gradients, where the background varies under the text.
- Fit with the audience: whether the tone and style suit a solicitor or a skate shop.
- Real devices: how the page feels on a phone in one hand, in sunlight.
Accessibility testing shows the same limit. The W3C's guide to selecting evaluation tools says tools can assist but can't determine on their own whether a site is accessible, that some checks need manual review, and that results can be wrong or misleading. Treat a clean lint as "nothing obvious is broken", not "this is good".
A design QA checklist for the human part
- Read the page aloud from the top. Note anything vague, repeated or untrue.
- Look at it on a phone at about 375px wide and on a laptop. Is the main action visible early on both?
- Tab through every link and control with the keyboard. Can you always see where you are?
- Zoom to 200%. Does anything overlap or get cut off?
- Check every photo: is it yours, is it sharp, is the alt text a real description?
- Ask someone who hasn't seen it to tell you, after ten seconds, what the business does and what to do next.
Design linting in Anticode
Anticode runs design linting on every build. The Critic applies nineteen checks to the exact page that will ship, each aimed at a habit that makes generated sites look alike: among them the purple-to-blue gradient, emoji used as icons, stock AI phrases, more than one font family or pairing, default easing, a hero forced to full screen height, cards that all lift on hover, body text under 16px, the "X, not Y" headline formula, links that go nowhere, placeholder phone numbers and the fonts nearly every AI-built site picks. The full list is on how Anticode works.
Since 23 October 2026 a design gate also blocks publishing pages that miss the basics: a language, a phone viewport, a title, visible keyboard focus, reduced-motion support, alt text, and no serif type at all, third font family, purple-blue gradient, stock phrases, placeholder text or empty links. The release checklist runs every publish check without publishing, so you can see the results first.
Questions people ask
What can a design linter check?
Anything with a measurable answer in the code: fonts, sizes, contrast ratios, palette and token use, placeholder text, empty links, missing alt text and known visual habits.
Can automated tools check accessibility?
Partly. They find many measurable problems, but the W3C notes that some checks need manual review and tools can't determine accessibility on their own.
Can a linter tell if a design is good?
No. It can tell you a design avoids known mistakes; whether it communicates well is a human judgement.