Prompts & plugins
Taste Skill
Taste Skill is an open-source agent skill that empowers AI coding assistants like Claude Code, Codex, and Cursor with professional art direction.
What is Taste Skill?
Taste Skill is an open-source agent skill that empowers AI coding assistants like Claude Code, Codex, and Cursor with professional art direction.By leveraging a library distilled from 247 curated sites, providing real photographic assets, and performing real-browser checks, it ensures the pages AI builds look designed rather than generically generated.
The tool offers 20 distinct design directions (such as 'The pinned poster' or 'The product performs') and automatically sources properly credited images from platforms like Openverse and Wikimedia Commons.Crucially, it includes an inspector that tests pages at multiple viewport sizes (1440px, 768px, 390px), identifying and fixing layout issues like margin slop or missing elements to guarantee a polished final result.
Key features
- Professional ArtProvides 20 curated design directions, allowing the AI to select styles that fit the context instead of defaulting to generic templates.
- Real Asset IntegAutomatically searches for and credits real images from sources like Openverse and Wikimedia Commons, using only safe licenses (CC0, Public Domain, CC BY).
- Real-Browser InsRenders pages in a real browser at multiple viewports (1440px, 768px, 390px) to detect layout issues such as margin slop, off-center elements, or empty gaps.
- Self-CorrectionAutomatically fixes detected visual errors for up to three rounds, ensuring the final output meets strict design quality standards.
- App Screen AwareSince v2.1, distinguishes between marketing pages and app screens, applying specific rules for dashboards, admin views, and data-heavy interfaces.
- Seamless IntegraInstalls via `npx skills add` with no API keys required.Runs on Node 22+ and requires an installed Chrome, Edge, or Chromium browser.
How to use it
- Ensure you have Node.js 22 or newer and a Chromium-based browser (Chrome, Edge, or Chromium) installed on your machine.
- Run the command `npx skills add Leonxlnx/taste-skill` in your terminal to install the skill into your project.
- Start a new chat in Claude Code, Codex, or Cursor; the agent will automatically load the SKILL.md file and recognize the design capabilities.
- Describe your page requirements to the agent (e.g., 'Build a one-page site for a coffee shop'), and it will apply Taste Skill's design logic.
- Check the preview link generated by the agent, which starts a local server and runs automated browser inspections to verify design quality.
Where it fits
- Rapid PrototypinQuickly generate landing pages with professional visuals for startups or internal tools without manually tweaking CSS details.
- Content-Rich WebBuild blogs, magazine-style layouts, or portfolios using real images and strict typography rules to ensure aesthetic text-image integration.
- Admin DashboardsGenerate clean, aligned, and data-oriented dashboard and settings pages, avoiding the clutter typical of generic AI-generated interfaces.
Pricing and free quota
Pricing and any free quota follow the official site.
Who it is for
- Frontend Developers
- Full-Stack Engineers
- Indie Hackers
- UI/UX Designers
FAQ
Do I need to pay to use Taste Skill?
No.Taste Skill is open-source and can be installed and used for free via npx.The team also offers a free and open-source desktop app called TasteCode.
Which AI coding tools are supported?
It currently supports agents that read SKILL.md files, including Claude Code, Codex, Cursor, OpenCode, Gemini CLI, and Antigravity.
How are image copyrights handled?
Taste Skill only sources images with CC0, Public Domain, CC BY, and CC BY-SA licenses from platforms like Openverse and Wikimedia Commons, automatically crediting them on the page.
Why did my page inspection fail?
The inspector checks for uneven margins, text too close to edges, or large empty gaps.The agent will automatically attempt to fix these issues, usually passing after a few iterations.