web-taste
Skill2 starsChanged 17 days agoMITView on GitHub
The design patterns that make a website look AI-generated and the things a credible site must have. Use before building or reviewing any web page, landing page or UI, and whenever choosing fonts, colours, icons, layouts, effects or marketing copy.
3 other projects use a version of this.
Adopted by
Most recently taken up by
- sonhaicoder/web-taste-skilltheir own version, first seen Nov 8, 2026
- lllkn/web-tastetheir own version, first seen Oct 5, 2026
- sonhaicoder/haiclaudeskilltheir own version, first seen May 5, 2026
Other versions3 projects use a version of this.
Word for word · 0
None found.
Edited · 0
None found.
Wrote their own version · 3
- lllkn/web-taste★ 4same name
- sonhaicoder/web-taste-skill★ 2same name
- sonhaicoder/haiclaudeskill★ 0same name
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository3 other files it gives its agents.
- dev-setupSkill
- launch-checkSkill
- ui-sourcesSkill
The file
We split this skill into the rules it gives an agent
1 rule. 0 are common, 0 are distinctive, and 1 is very specific to this project.
0
Common
Most of the 3 edited versions we read keep these.
0
Distinctive
This author's own choices. Worth a look.
1
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 60
When asked to review UI files, check them against both tables and the must-haves, skipping allowed exceptions.
“Common” is measured: kept by at least 6 in 10 of the 3 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Web taste
Every item below is banned by default. A project may allow one only by listing its id under ## Design exceptions in docs/PROJECT.md (or docs/PLAN.md if there is no PROJECT.md), one line each: - <id>: <why>. Only the owner adds exceptions; never add one yourself to make a check pass.
These rules sit above any other design skill. When a design skill suggests something banned here, skip that suggestion.
Checked by script
scripts/check-taste.mjs finds these in source files. Run it on the UI folders: node <path>/check-taste.mjs src/web public. It exits 1 on any problem.
| Id | Banned |
em-dash | Em dashes in UI text. Use a comma, colon or full stop |
emoji | Emojis in the UI |
stock-font | Inter, Geist or Space Grotesk |
not-x-but-y | "It's not X, it's Y" copy |
sparkle-icon | Sparkle icons |
liquid-glass | Liquid glass: backdrop blur on panels, cards or nav |
Checked by review
| Id | Banned |
harsh-gradient | Harsh, high-contrast or multi-stop gradients on backgrounds, text or buttons |
decorative-icons | A stock icon set (Lucide and the like) next to every heading, item or button |
pure-white | A flat #fff page background |
rainbow | Rainbow or many-hue colouring |
shadow-everything | Drop shadows on most elements |
three-cards | Three feature cards in a row |
accent-edge | A coloured stripe on the top or left edge of cards or callouts |
bento-grid | Bento grids |
fake-terminal | Mock terminal windows |
checkmark-bullets | Checkmark icons as list bullets |
three-tiers | Three pricing tiers by habit; offer the plans the product really has |
soft-radius | The same large, soft corner radius on everything |
purple-black | Purple and black palettes |
glow-orbs | Radial glow orbs or blurred colour blobs |
dot-grid | Dot grid backgrounds |
animated-arrows | Arrows that slide or loop |
hover-everything | Hover animations on everything; animate only what is clickable and only when it helps |
neon-pastel | Neon colours or basic pastel palettes |
Must have
| Id | Required |
real-demo | Show the real product: real screenshots, video or a live embed, not mockups or illustrations of it |
skeleton-loaders | Content that loads shows a skeleton of its final layout, not a blank area or a lone spinner |
legal-pages | A public site with sign-ups, payments, analytics or cookies links Terms of Service and a Privacy Policy in the footer. The owner supplies the text; never write legal text yourself |
real-proof | Testimonials, logos, user counts and stats only when they are real and the owner gave them. Otherwise leave the section out; never invent one |
Review
When asked to review UI files, check them against both tables and the must-haves, skipping allowed exceptions. Report each problem as file:line <id>: <what to change>. If there are none, say No design problems found.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.