Taste Skill for Claude Code: what v2.5 does, how to install it, and where the old version went

Taste Skill is an open-source agent skill that stops coding agents such as Claude Code and Codex from producing the same generic-looking pages. The project is Leonxlnx/taste-skill on GitHub, under the MIT licence, with about 110k stars when checked on 2026-11-08. Its site is tasteskill.dev.

The first thing to know: most videos and tutorials show the old version, a single SKILL.md with three 1–10 dials. The repo now installs version 2.5 by default (2.5.1 shipped on 2026-11-07), which is a set of scripts with a real-browser check and works quite differently. The old version still exists; it moved to another repo.

Which version is which

The old versions' dials sit at the top of the file: DESIGN_VARIANCE (centred and clean to asymmetric), MOTION_INTENSITY (hover only to scroll-driven) and VISUAL_DENSITY (spacious to dense). Change the numbers to tune the output.

Install the current version (2.5)

As a Claude Code plugin, send these as two messages in Claude Code:

/plugin marketplace add Leonxlnx/taste-skill

/plugin install taste-skill@taste-skill

The skill is namespaced under taste-skill:, so it does not clash with your other skills. Use /plugin update to upgrade later.

With the skills CLI (it asks which agent to install into):

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

Already have an older design-taste-frontend? Run the same command again to upgrade to 2.5; the install name did not change.

For Codex:

codex plugin marketplace add Leonxlnx/taste-skill
codex plugin add taste-skill@taste-skill

Start a new Codex session afterwards so the skill loads.

What it needs

• Node.js 22 or later: every tool in the skill is a Node script.
• Chrome, Edge or Chromium: the checks open the page in a headless browser. If the browser is somewhere unusual, set CHROME_PATH.
• ffmpeg (optional): for WebP output and the phone crop of a hero photograph.
• No API keys, and it installs nothing system-wide. The bundled photographs work offline; fetching more photographs, Google Fonts or brand icons needs network access.

One more thing: 2.5 runs scripts in your project and, in Claude Code, registers a Stop hook. When the agent tries to finish, the hook runs the checks first and sends it back to fix what failed, for up to three rounds. That is a different kind of tool from the old text-only rules, so read the scripts in the repo before using it on a project that matters.

How to use 2.5

Ask the agent to build or redesign a company website, for example "a site for a specialty coffee shop". The skill then works roughly like this:

1. Classify the business as software, gaming, tech, product, service or place. Palette, type and effects all follow from this.
2. Deal a palette, fonts and a hero layout: a script picks a palette for the trade, a Google Fonts pairing, and one of 11 tested hero layouts.
3. Start from one system: one section per screen, equal left and right edges, a fixed navigation bar.
4. Use real material: software and tech pages get real product UI fragments and icons; cafes, hotels and shops get curated real photographs from open collections such as Wikimedia Commons, credited in the footer. Shaders and scroll effects are reserved for software, tech and gaming pages.
5. Check in a real browser at widths such as 1440, 1024, 768 and 390, looking for empty visuals, low contrast, misaligned columns, placeholder text and invented street numbers, and keep fixing for up to three rounds.

It also works inside an existing React, Vue, Svelte, Astro or Tailwind project in that project's own stack; a Next.js brief is built as a static export.

Installing the old versions

The old versions and the style variants live in Leonxlnx/taste-skill-classics:

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

Swap in any install name from the table above, or leave out --skill to install all seven. As a plugin: /plugin marketplace add Leonxlnx/taste-skill-classics, then /plugin install taste-skill-classics@taste-skill-classics.

The classic skills never trigger on their own. Call one by name, for example /high-end-visual-design in Claude Code.

Taste Skill or the official frontend-design plugin?

Claude Code's official plugin marketplace also has a frontend-design plugin, made by Anthropic. The two are quite different:

If you only want less of the generic AI look in everyday UI work, the official plugin or the old Taste Skill is enough: light, and no scripts. If you want a complete site that is ready to ship and you are happy to let the agent check it in a browser several times, use 2.5.

Does it cost more tokens?

Yes. Before handing over, 2.5 runs its checks and fixes what they find, for up to three rounds, which adds several extra turns compared with writing a page once. How much depends on the page. The reliable answer is your own bill: if you pay per token, note the start and end times and add up that build's requests. With CCSub, for example, the Usage page in the dashboard lists tokens and charge for every request.

Does it depend on your API provider?

No. Taste Skill changes how the agent builds pages and does not touch your API settings, so it installs and behaves the same whether Claude Code uses an official account or a third-party service.

If you have not set up Claude Code yet, see the Claude Code setup guide; for Codex, see the Codex CLI guide.