Development
PopularPlugin
taste-skill
The Anti-Slop Frontend Framework for AI Agents Sponsors Novamira · Full WordPress access for AI agents IMG.LY · CreativeEditor SDK Emil Kowalski · animations.dev Sent.dm · messaging APIs for SMS, WhatsApp, and RCS Become a
Plugin Signal83/100Strong
maintained91
capable55
documented100
adopted100
Install on Claude Code
> /plugin marketplace add Leonxlnx/taste-skill> /plugin install taste-skill@taste-skill
Stats
74,608
Stars
5,109
Forks
Active
Maintenance
JavaScript
Language
MIT
License
17d ago
Last commit
5mo ago
Created
Repo: Leonxlnx/taste-skill
What's inside
Skills
13/brandkitPremium brand-kit image generation skill for creating high-end brand-guidelines boards, logo systems, identity decks, and visual-world presentations. Trained for minimalist, cinematic, editorial, dark-tech, luxury, cultural, security, gaming, developer-tool, and consumer-app/brutalist-skillRaw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics. Rigid grids, extreme type scale contrast, utilitarian color, analog degradation effects. For data-heavy dashboards, portfolios, or editorial sites that need to feel like declassified/gpt-tasteskillElite UX/UI & Advanced GSAP Motion Engineer. Enforces Python-driven true randomization for layout variance, strict AIDA page structure, wide editorial typography (bans 6-line wraps), gapless bento grids, strict GSAP ScrollTriggers (pinning, stacking, scrubbing), inline/image-to-code-skillElite website image-to-code skill for Codex. For visually important web tasks, it must first generate the design image(s) itself, deeply analyze them, then implement the website to match them as closely as possible. In Codex, it must prefer large, readable, section-specific/imagegen-frontend-mobileElite mobile app image-generation skill for creating premium, app-native screen concepts and flows. Designed for iOS, Android, and cross-platform mobile products. Prioritizes clean hierarchy, comfortably readable text, strong multi-screen consistency, controlled color palettes,/imagegen-frontend-webElite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections produces 8 images. Never compress multiple sections into one
Show all 13 skillsShow fewer
/minimalist-skillClean editorial-style interfaces. Warm monochrome palette, typographic contrast, flat bento grids, muted pastels. No gradients, no heavy shadows./output-skillOverrides default LLM truncation behavior. Enforces complete code generation, bans placeholder patterns, and handles token-limit splits cleanly. Apply to any task requiring exhaustive, unabridged output./redesign-skillUpgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS./soft-skillTeaches the AI to design like a high-end agency. Defines the exact fonts, spacing, shadows, card structures, and animations that make a website feel expensive. Blocks all the common defaults that make AI designs look cheap or generic./stitch-skillSemantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards — strict typography, calibrated color, asymmetric layouts, perpetual micro-motion, and hardware-accelerated performance./taste-skill-v1The original v1 taste-skill, preserved for projects depending on its exact behavior. The current default is `design-taste-frontend` (v2 experimental), which is a substantial rewrite. Use this v1 install name only if you need exact backward compatibility./taste-skillAnti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, audit-first on redesigns, strict pre-flight check.
README
1Taste Skill
Portable Agent Skills that upgrade AI-built interfaces: stronger layout, typography, motion, and spacing instead of boilerplate-looking UIs. This repo also includes image-generation skills for reference boards (web, mobile, brand kits). Pair them with ChatGPT Images or similar generators, then hand the frames to Codex, Cursor, or Claude Code for implementation.
Disclaimer
Taste Skill has no official token, coin, or crypto project. Any token using my name, image, or project is unaffiliated and not endorsed by me.
Feedback & Contributions
We would love your feedback. Suggestions and bug reports:
- Open a Pull Request or Issue on GitHub
- DM @lexnlin or @blueemi99
- Email us at hello@tasteskill.dev
Installing
The npx skills add CLI scans the skills/ folder in this repo, so all skills below (code and image-generation) install the same way.
npx skills add https://github.com/Leonxlnx/taste-skill
Install a single skill by its install name (the name: field inside the SKILL frontmatter, not the folder name):
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
You can also copy any SKILL.md into your project or paste it into ChatGPT / Codex conversations.
Updating from the previous version
The default taste-skill (install name design-taste-frontend) is now v2 (experimental), a substantial rewrite of the original v1. If you already have v1 installed, just re-run the install command and you will be upgraded:
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
The install name did not change, so no script updates are needed. The newer SKILL.md replaces the older one in place.
If you depend on the exact behavior of v1 and want to pin to it explicitly:
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend-v1"
See CHANGELOG.md for the full v1 to v2 diff and the rationale.
Skills
Each skill does one job; you do not need all of them at once. Implementation skills output code. Image-generation skills output reference images only.
The Install name column is the exact value you pass to --skill.
| Skill (folder) | Install name | Description |
|---|---|---|
| taste-skill | design-taste-frontend | 🆕 v2 (experimental) - substantial rewrite of the default skill. Reads the brief, infers the design language, tunes three dials (VARIANCE / MOTION / DENSITY). Brief inference, design-system map, hard em-dash ban, canonical GSAP code skeletons, redesign-audit protocol, strict pre-flight check. Actively iterating toward v2.0.0 stable. |
| taste-skill-v1 | design-taste-frontend-v1 | The original v1 of taste-skill, preserved for projects depending on its exact behavior. Use only if the v2 default breaks something specific in your workflow. |
| gpt-tasteskill | gpt-taste | Stricter variant for GPT/Codex: higher layout variance, stronger GSAP direction, aggressive anti-slop. |
| image-to-code-skill | image-to-code | Image-first pipeline: generate site references, analyze them, then implement the frontend to match. |
| redesign-skill | redesign-existing-projects | Existing projects: audit the UI first, then fix layout, spacing, hierarchy, styling. |
| soft-skill | high-end-visual-design | Polished, calm, expensive UI with softer contrast, whitespace, premium fonts, spring motion. |
| output-skill | full-output-enforcement | When the model ships half-finished work: full output, no placeholder comments. |
| minimalist-skill | minimalist-ui | Editorial product UI (Notion/Linear vibes), restrained palette, crisp structure. |
| brutalist-skill | industrial-brutalist-ui | Hard mechanical language: Swiss type, sharp contrast, experimental layout. |
| stitch-skill | stitch-design-taste | Google Stitch-compatible rules, including optional DESIGN.md export format. |
Image generation skills
These produce design images only (no code). Use with ChatGPT Images, Codex image mode, or any agent that generates images.
| Skill (folder) | Install name | Description |
|---|---|---|
| imagegen-frontend-web | imagegen-frontend-web | Website comps: hero, landing, multi-section with strong typography, spacing, anti-slop art direction. |
| imagegen-frontend-mobile | imagegen-frontend-mobile | Mobile screens and flows: iOS/Android/cross-platform, mockups, readable type, coherent sets. |
| brandkit | brandkit | Brand-kit boards: logo directions, palettes, type, identity applications across categories. |
Which one should I use?
- Start with taste-skill for the safest general default. (Now v2 experimental - see what changed in the CHANGELOG.)
- If you depend on the exact behavior of the original taste-skill, install taste-skill-v1 instead.
- Use gpt-taste when you want the stricter GPT/Codex-oriented rules and motion/layout enforcement.
- Use image-to-code-skill for image → analyze → code website workflows.
- Use redesign-skill to improve an existing codebase instead of greenfield styling.
- Add soft-skill, minimalist-skill, or brutalist-skill when the visual direction is already chosen.
- Add output-skill if the agent keeps truncating output.
- Use imagegen-frontend-web, imagegen-frontend-mobile, or brandkit when the deliverable is images (comps, flows, identity boards), then pass results to your coding agent.
Image-first tip
For image-to-code-skill, state the pipeline in the prompt, e.g.: follow the skill: generate images, then analyze, then code.
ChatGPT Images and Codex
Attach or paste imagegen-frontend-web, imagegen-frontend-mobile, or brandkit and ask for the frames you need, then feed the renders to Codex, Cursor, or Claude Code. Use image-to-code-skill when you want one workflow that both generates references and implements the site in code.
Settings (taste-skill only)
Numbers at the top of the file are 1-10 dials:
- DESIGN_VARIANCE: Layout experimentation (lower: centered/clean · higher: asymmetric/modern).
- MOTION_INTENSITY: Animation depth (lower: hover · higher: scroll/magnetic).
- VISUAL_DENSITY: Information per viewport (lower: spacious · higher: dense dashboards).
Examples
Created with taste-skill:
Support the project
If Taste Skill helps you, consider sponsoring:
Community Sponsors
Research
Background writing that shaped these skills lives in research/.
Common Questions
How is this different from other AI design skills?
Multiple specialized variants, adjustable dials in key skills, anti-repetition rules informed by dedicated research. All are framework agnostic across major coding agents.
Does it work with React, Vue, Svelte?
Yes. Rules target design intent, not a single framework API.
What is SKILL.md?
A portable instruction file agents can load automatically; install via npx skills add or by copying into a repo or conversation.
Do image-generation skills install with npx skills add?
Yes. They live under skills/ alongside the code skills so the same CLI discovers them.
License
MIT License · Copyright (c) 2026 Leonxlnx
File tree
58Leonxlnx/taste-skillView on GitHub
.claude-plugin/
marketplace.json
plugin.json
.github/
copilot-instructions.md
FUNDING.yml
assets/
.gitkeep
readme-banner.webp
readme-buttons/
btn-agent-skills.webp
btn-changelog.webp
btn-mit.webp
btn-site.webp
btn-tools.webp
readme-cta-tasteskill.svg
sponsors/
animations-dev.webp
emil-animations-dev.webp
imgly-logo.svg
sentdm.png
vercel-logo.svg
taste-skill-logo.png
taste-skill-logo.webp
vercel-oss-program-badge.svg
CHANGELOG.md
examples/
floria-bottom.webp
floria-full.webp
floria-top.webp
LICENSE
README.md
research/
laziness/
findings/
empirical-results.md
references.md
README.md
remediation/
architectural-patterns.md
parameter-tuning.md
prompt-engineering.md
reference-prompts.md
root-causes/
cognitive-shortcuts.md
output-limits.md
rlhf-and-compute.md
training-data-bias.md
README.md
scripts/
build-emil-sponsor-row.mjs
convert-readme-assets-webp.mjs
process-readme-buttons.mjs
process-sponsor-badge.mjs
skill.sh
skills/
brandkit/
SKILL.md
brutalist-skill/
SKILL.md
gpt-tasteskill/
SKILL.md
image-to-code-skill/
SKILL.md
imagegen-frontend-mobile/
SKILL.md
imagegen-frontend-web/
SKILL.md
llms.txt
minimalist-skill/
SKILL.md
output-skill/
SKILL.md
redesign-skill/
SKILL.md
soft-skill/
SKILL.md
stitch-skill/
DESIGN.md
SKILL.md
taste-skill/
taste-skill-v1/
SKILL.md
SKILL.mdFAQ
taste-skill is a Claude Code plugin with 13 hand-picked skills for development work, indexed on Flowy. Install it with the command on its page. It includes brandkit, brutalist-skill, gpt-tasteskill. Its skills do not fire on their own yet. Request auto-invocation to have Flowy route them as you prompt. Free and open source.
- What is taste-skill?
- The Anti-Slop Frontend Framework for AI Agents Sponsors Novamira · Full WordPress access for AI agents IMG.LY · CreativeEditor SDK Emil Kowalski · animations.dev Sent.dm · messaging APIs for SMS, WhatsApp, and RCS Become a
- How do I install taste-skill?
- Run these in Claude Code: /plugin marketplace add Leonxlnx/taste-skill then /plugin install taste-skill@taste-skill. Then prompt normally.
- Does taste-skill auto-invoke its skills?
- Not yet. It is indexed on Flowy as a plain plugin. Request auto-invocation on its page and Flowy will route its skills for you as you prompt.
- Is taste-skill free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.