Skip to content
Home About Services Portfolio Blog Contact Get Started
AI & Automation

Agent Design Taste Skill for Coding Agents: How Taste Skill Stops AI Slop

Written by

MTD Technologies

Published
Read Time 10 min
Agent design taste skill for coding agents

An agent design taste skill for coding agents sounds like a contradiction. Taste is supposed to be the human part — the judgement call a designer makes when a layout feels right. Yet that is exactly what Taste Skill sets out to give a coding agent: a point of view, real photographs, and a way to check its own work in a real browser instead of shipping the first plausible page. With more than 100,000 stars on GitHub, it is one of the most-watched design skills of the current agent-coding wave, and it is worth understanding properly before you install it on a client project. This deep-dive explains what it does, how it works, what it costs in time and tokens, and where it will still let you down.

If you build websites for clients, you already know the problem. Ask a coding agent for a landing page and you usually get something competent and forgettable: a purple gradient hero, three feature cards, a testimonial strip, and a footer. Nothing is broken, nothing is memorable, and nothing looks designed for that particular business. Teams call this “AI slop” for a reason. It is not a failure of code but of decision-making: the agent had no direction, no reference material, and no critic, so it averaged every landing page it had ever seen.

What Taste Skill actually is

Taste Skill is an open-source agent skill, MIT-licensed, whose current flagship skill is called design-taste-frontend. It is not a website builder, a theme, or a component library. It is a set of instructions and scripts that a coding agent — Claude Code, Codex, Cursor, or a similar tool — follows when it is asked to design a page. The skill’s own description is admirably blunt: it makes coding agents design websites and app screens instead of assembling the average landing page.

The distinction matters. Most design prompts tell an agent what a page should look like in general terms: modern, clean, premium. Taste Skill forces a specific decision first: pick an art direction, tie it to something only that client has, and build to it. If the agent cannot articulate the idea in one sentence, it has not finished thinking yet.

There is also a desktop companion, TasteCode, from tasteskill.dev, but the GitHub repository remains the open-source core covered here. Older skills from the same author have moved to separate repositories, so check old install instructions point at the current design-taste-frontend skill rather than a retired one.

Agent design taste skill for coding agents

What it can do: the six-step build

The current version of the skill, v2, is built from a study of 247 curated websites, drawn from galleries such as Awwwards Sites of the Day and One Page Love. That research is not decoration. It is distilled into a library of 20 researched art directions, each carrying a type system, a palette, hero compositions, and section blueprints. A build then runs in six steps:

  • Read the brief properly. The agent lists what only this client has — its photographs, its story, its product, its tone — rather than reaching for stock assumptions.
  • Deal a direction. A script deals three of the 20 researched directions and the agent picks one. Randomness here is deliberate: it stops the agent defaulting to the same safe direction every time.
  • Find the idea. The agent writes one sentence tying the client’s own material to the chosen direction. This is the creative brief for everything that follows.
  • Build with real pictures. Instead of generated filler imagery, the skill sources real photographs and footage from open collections such as Wikimedia Commons, Openverse, and the Met, and credits them on the page.
  • Check in a real browser. The page is rendered at three widths and failed on “slop” — the generic patterns the skill’s house style bans.
  • Look, then fix. The agent inspects its own screenshots, fixes the top three problems, and repeats for up to three rounds.

Version 2.1 extends the same discipline to dashboards and app screens, which take their own route: an app style dealt from real product screens, quiet panels, aligned figures, colour spent on data, and a phone layout where navigation folds away. A product landing page also builds the app it shows, so its screenshots look like a working product. It also checks each page’s frame — a clear first-screen title, equal margins, no lopsided sections or random blank stretches.

How it works in practice: setup and usage

Installation is low-friction. The recommended route uses npx skills:

npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"

Claude Code users can alternatively add it as a plugin marketplace item, and Codex users have an equivalent plugin route. From a clone, an install script can symlink the skill into Claude Code or Codex so that a later git pull updates it in place. The scripts need Node 22 or newer and an installed Chrome, Edge, or Chromium browser. The skill installs nothing else, needs no API keys, and only needs network access to find pictures.

That changes the cost conversation: there is no subscription and no hosted service in the loop. Your costs are the agent’s tokens and your review time. The README is honest about scale: roughly 30 to 45 minutes and a few hundred thousand tokens per build. That is a serious budget for a one-off page, but cheap for a client homepage that must carry the business for two years — provided someone senior reviews the result.

Agent design taste skill for coding agents browser check

Taste Skill arrived at the exact moment the agent-coding wave hit its quality problem. In 2025 and 2026, teams went from marvelling that an agent could build a page at all to noticing that every agent-built page looked the same. The backlash has a name — design slop — and a whole category of skills has grown up to fight it. Taste Skill is the most starred design skill in that category, and its approach explains why: it treats taste as a testable process rather than a vibe.

Three choices make that process work. The direction is dealt, not chosen from habit, so output varies between projects. The photographs are real and credited, lifting a page out of the generated-stock look. And the browser check is a gate, not a suggestion: a failing page goes back for fixes, with screenshots as evidence. Together they form a loop — decide, build, inspect, fix — that mirrors how a human designer works.

From our experience: where it helps, and where it will not save you

At MTD Technologies, we build websites, booking systems, CRMs, and custom software, and we have learned where automation helps and where it quietly creates rework. Taste Skill fits the first category for one job: getting from a brief to a distinctive first design a human can refine. It does not fit shipping a finished client site unsupervised.

The honest limitations start with cost. A few hundred thousand tokens and up to 45 minutes per build means you should not run it casually on every page. Use it where design quality moves the business — the homepage, a flagship landing page, a launch page — and cheaper approaches for routine interior pages. Second, a dealt direction is a starting point, not a brand strategy. If your client has no clear positioning, the skill will dress up that confusion beautifully rather than resolve it. Do the positioning work first.

Third, real photographs are a strength and a liability. The skill credits open-archive images correctly, but credited archive photography is no substitute for a client’s own product photography. Treat its pictures as high-quality placeholders with a paper trail, not final assets, and replace brand-critical images before launch. Finally, the browser check catches layout slop, not bad copy, weak offers, or confusing navigation. A page can pass every visual gate and still fail as a business tool — review words and conversion path with the same rigour as layout.

A note on images, licences, and responsible use

Taste Skill only offers public domain, CC0, CC BY, or CC BY-SA files, and credits them on the page. Keep those credits until you replace an image with one you own, and check the licence before altering a CC BY-SA image in restricted ways. Likewise, do not use the skill to clone a competitor’s distinctive design wholesale: a direction inspired by award-winning sites is a starting point for original work, not a licence to lift another studio’s layout and swap the logo.

Getting started: a sensible first run

  1. Install the skill with the npx skills add command above, or via your agent’s plugin marketplace, and confirm it is loaded in a fresh session.
  2. Check the prerequisites: Node 22 or newer, and Chrome, Edge, or Chromium installed. The browser is not optional — it is how the skill checks its own work.
  3. Write a real brief. Include what only this client has: its story, its photographs, its offer, its audience. A vague brief produces a vague direction, however good the skill is.
  4. Pick one flagship page, not a whole site. Run the skill on the homepage or a launch page, and budget 30 to 45 minutes plus review time.
  5. Review the screenshots, not just the code. Open the three-width browser captures the skill produces and judge the page the way a visitor would: first screen, hierarchy, and whether anything looks templated.
  6. Replace archive images with owned imagery before launch wherever the image carries brand meaning, and keep credits for anything you retain.
  7. Hand the result to a human designer for a final pass on copy, conversion path, accessibility, and brand consistency. The skill gets you to a strong draft; it does not sign off a client site.

If you want help putting agent-built design into a real client workflow, our team builds business websites and AI integrations with human review at every gate that matters. Browse more tools in our AI Tools Directory, or talk to us about a project.

Frequently asked questions

Is Taste Skill free?

Yes. It is MIT-licensed open source, installs nothing beyond its scripts, and needs no API keys. Your costs are your coding agent’s tokens and your review time — a build takes roughly 30 to 45 minutes and a few hundred thousand tokens, according to the README.

Which coding agents does it work with?

It is documented for Claude Code, Codex, and Cursor, with plugin routes for the first two and the npx skills installer as the general route. The design rules are framework-agnostic, so the pages it builds can use React, Next.js, Vue, Svelte, Astro, Tailwind, or plain HTML and CSS.

Does it work for dashboards and app screens, or only landing pages?

Since v2.1 it handles dashboards and app screens with a dedicated route: an app style dealt from real product screens, quiet panels, honest data and charts, and app-specific browser checks. Landing pages and app screens are treated as different jobs, which is one of the skill’s better decisions.

Can I use the photographs it finds on a commercial site?

Only within their licences. The skill sources public domain, CC0, CC BY, and CC BY-SA files from open collections and credits them on the page. Keep those credits until you replace an image with one you own, and replace brand-critical imagery with owned photography before launch.

Will it replace a human designer?

No. It replaces the blank page and the generic first draft, and enforces a review loop most agent output skips. Positioning, copy, conversion, accessibility, and final brand judgement still need a human — use it as a strong draft machine with senior review, not an unsupervised ship button.

Taste Skill matters because it names the real problem with agent-built design and builds a process around it: decide a direction, build with real material, check in a real browser, fix what the screenshots show. Used that way — on flagship pages, with a real brief and human review — an agent design taste skill for coding agents becomes a practical part of shipping distinctive work. Judge it on the screenshots, not the star count, and keep a human in the loop where the business outcome is decided.