Taste Skill

Skills against boilerplate-looking UIs: layout, type, motion and spacing, plus reference image generation for web and mobile

SkillLow risk

leonxlnx/taste-skill

Install

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

All skills in the repo

This is third-party code. Review the repository files before installing.

What it does

A set of skills that teach an agent to build interfaces with deliberate layout, typography, motion and density. The main design-taste-frontend skill reads the brief, infers a visual language and is tuned with three dials: DESIGN_VARIANCE, MOTION_INTENSITY and VISUAL_DENSITY. Other skills set a style (minimalist, brutalist, soft premium), handle redesigns or force full output. The imagegen-frontend-web, imagegen-frontend-mobile and brandkit skills produce reference images only.

Who it is for. Frontend developers and designers tired of generic AI-built interfaces.

Good fit when

  • You are building a landing page or portfolio and want a non-template look
  • You need to audit and redesign an existing UI
  • You need screen references before implementing in Codex, Cursor or Claude Code
  • The model truncates code with placeholders and you need full output

Not a fit when

  • You need a strict corporate design system with no layout experiments
  • The project is not a web interface

Example request

Build a landing page for our booking service with design-taste-frontend, DESIGN_VARIANCE 7, MOTION_INTENSITY 4

Limitations

The v2 main skill is marked experimental, and design-taste-frontend-v1 preserves the old behavior. Image generation skills do not write code and need an image generator such as ChatGPT Images.

How to disable. Delete the skill folder from your agent's skills directory, for example .claude/skills or .agents/skills.

Security check

  • Skills are markdown instructions

README in short

Taste Skill is a set of portable Agent Skills for better AI-built interfaces, MIT licensed. It has implementation skills that output code and image generation skills for references. All install via npx skills add, and a single skill is selected by its install name. The README includes a guide on which skill fits which task and the main skill's settings.

SKILL.md

---
name: brandkit
description: Premium 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 brand systems. Optimized for intentional logo concepting, refined composition, sparse typography, strong symbolic meaning, premium mockups, art-directed imagery, and flexible grid layouts.
---

# BRANDKIT IMAGE GENERATION SKILL

You are an elite brand identity art director, logo designer, visual-system strategist, and presentation designer.

Your job is to generate premium brand-kit images that feel like they came from a serious identity studio.

The output must feel:
- intentional
- premium
- minimal
- coherent
- strategic
- visually expensive
- brand-system driven
- presentation-ready

Do not generate generic logos.  
Do not generate random mockups.  
Do not generate messy AI moodboards.

Create a complete brand world in one image.

---

# REFERENCE STYLE DNA

The desired visual quality is inspired by premium brand-guidelines decks with:

- dark charcoal outer canvas
- clean grid-based presentation boards
- strong gutters between panels
- restrained visual density
- very sparse typography
- large negative space
- cinematic brand atmosphere
- simple but memorable logo marks
- UI mockups used as brand applications
- browser chrome / app headers / terminal frames
- image-led panels with subtle overlays
- halftone, grain, scanline, or print texture
- geometric construction diagrams
- small labels and page-number details
- muted but powerful accent colors
- logo repeated across multiple touchpoints
- one strong brand idea per board

The references are not a fixed style.  
They define the quality bar, restraint, and presentation logic.

---

# CORE PRINCIPLE

A premium brand kit is not decoration.

FAQ

How do I get the v1 behavior back?

Install the skill named design-taste-frontend-v1, which is preserved as is.

What name goes into the --skill flag?

The name field from the SKILL.md frontmatter, not the folder name. For the taste-skill folder it is design-taste-frontend.

Editors’ pick

A frontend design skill with 23 commands, live browser iteration and 61 detector rules for common AI-generated UI tells

SkillHigh risk68K
Editors’ pick

Vercel's skills: React and Next.js performance, UI guideline audits, React Native, component composition and deploys

SkillMedium risk31.2K

A skill with a searchable base of styles, palettes, font pairings and UX rules that generates a design system per product type

SkillMedium risk127.6K

An open-source Claude Design alternative that builds prototypes, decks, dashboards and video through your local agents

MCP serverHigh risk96.2K