Taste Skill: Design-Anweisungen, damit ein Agent keine generische Oberfläche abliefert

Alles Wissenswerte zu Leonxlnx/taste-skill: eine portable Sammlung von Skills, die Code- und Bildagenten dazu anleitet, Weboberflächen mit expliziten Entscheidungen zu Komposition, Typografie, Bewegung und Dichte zu gestalten.

Was Taste Skill ist

Taste Skill ist eine Bibliothek aus SKILL.md-Dateien, keine Komponentenbibliothek und kein eigenständiger Oberflächengenerator. Das erklärte Ziel besteht darin, Agenten wie Codex, Cursor und Claude Code Design-Anweisungen zu geben, um repetitive oder vorlagenhaft wirkende Ergebnisse zu vermeiden. Die Sammlung enthält Skills zur Implementierung von Oberflächen sowie andere, die Referenzbilder erzeugen, die anschließend an einen Code-Agenten übergeben werden.

Der Standard-Skill, installiert als design-taste-frontend, liest den Auftrag, leitet eine visuelle Richtung ab und stellt drei Regler ein: Design-Varianz, Bewegungsintensität und visuelle Dichte. Das Repository behauptet, framework-unabhängig zu sein: Die Regeln gelten für die visuelle Absicht, nicht für eine bestimmte API, und das README nennt ausdrücklich React, Vue und Svelte.

Der Name sollte nicht als objektiver Beweis ästhetischer Qualität gelesen werden. Das Projekt liefert Anweisungen; das Ergebnis hängt vom Modell, vom Auftrag, von den Referenzen, von der Umsetzung und von der menschlichen Überprüfung ab.

Der Ursprung: von einem persönlichen Profil zu einer Skill-Sammlung

Die GitHub-API datiert die Erstellung des Repositorys auf den 19. Februar 2026. Eigentümer und Hauptbeitragender ist Leon Lin (Leonxlnx), dessen öffentliches Profil München, die Seite own.page/leonlin und den X-Account @lexnlin angibt. Die zuletzt abgerufene Änderung wurde am 23. Juli 2026 von Leon Lin signiert und betraf die Darstellung eines hervorgehobenen Sponsors.

Das Projektmaterial selbst beschreibt die Spannung, die die Sammlung motiviert: Agenten können funktionierende Seiten erzeugen, neigen aber dazu, visuelle Konventionen zu wiederholen. Statt dies mit einem geschlossenen Komponenten-Kit zu lösen, kodiert Taste Skill ein Prüfkriterium in Textform: den Auftrag analysieren, eine visuelle Sprache wählen, wiederholte Muster vermeiden und vor der Auslieferung eine Vorabprüfung durchführen.

Die sichtbare Entwicklung ist in CHANGELOG.md dokumentiert: Das alte v1 bleibt als design-taste-frontend-v1 erhalten, während das experimentelle v2 zur Standardinstallation wurde. Die Änderung behält die drei Regler bei und ergänzt Auftragsinferenz, eine Zuordnung zu offiziellen Designsystemen, wenn der Auftrag dies erfordert, ein Dark-Mode-Protokoll und eine Prüfung für Redesigns. Es gibt keine GitHub Releases, weshalb dieser Übergang als Repository-Inhalt und nicht als getaggte Version verteilt wird.

Split-Screen, der ein altes Terminal von Version 1 einer modernen holografischen Oberfläche von Version 2 experimental gegenüberstellt, mit Zuordnungen zu Designsystemen wie Material, Carbon und Polaris.

Philosophie und Prinzipien

Die dokumentierte Philosophie lässt sich so zusammenfassen:

Der Auftrag vor der Standardästhetik. V2 verlangt, Seitentyp, Referenzen, Zielgruppe, Einschränkungen und Stimmungsworte zu identifizieren, bevor Code geschrieben wird.

Holografisches Dokument mit dem Titel "Der Auftrag", das Lichtstrahlen zu Konzepten wie Zielgruppe, Seiten-Wireframe, Farbpalette und Typografie aussendet.

Kontrollierte Variation, keine Zufälligkeit. Die Regler DESIGN_VARIANCE, MOTION_INTENSITY und VISUAL_DENSITY werden als Skalen von 1 bis 10 ausgedrückt, um Entscheidungen explizit zu machen, die sonst implizit blieben.

Futuristisches Bedienfeld mit drei Neon-Reglern, die DESIGN_VARIANCE, MOTION_INTENSITY und VISUAL_DENSITY darstellen, jeweils auf einem anderen Wert der Skala von 1 bis 10.

Echte Systeme, wenn die Anfrage es verlangt. Die v2-Änderung schreibt vor, das offizielle Paket für Aufträge zu verwenden, die Systemen wie Material, Fluent, Carbon, Polaris, Atlassian, Primer, GOV.UK, USWDS, Bootstrap, Radix, shadcn oder Tailwind entsprechen; für Ästhetiken wie Brutalismus oder kinetische Typografie schlägt sie Webstandards und eine ehrliche Kennzeichnung des gewählten Ansatzes vor.
Das Bild kann dem Code vorausgehen. Die Skills zur Bilderzeugung erstellen Referenz-Moodboards oder -Screens; image-to-code verkettet Erzeugen → Analysieren → Implementieren.

Workflow-Diagramm, das ein KI-generiertes visuelles Referenz-Moodboard zeigt, gefolgt von einem Code-Agenten, der die Implementierung schreibt, und endend in einer polierten Weboberfläche.

Die Auslieferung muss vollständig sein. full-output-enforcement existiert für Fälle, in denen das Modell Platzhalterkommentare oder eine unvollständige Auslieferung hinterlässt.

Wie es funktioniert

Taste Skill verwendet das Skill-Format, das das Tool npx skills add erkennt. Jeder Ordner unter skills/ enthält eine Spezialität, und der Installationsname ist das Feld name in ihren Metadaten, das nicht mit dem Ordnernamen übereinstimmen muss.

Die aktuelle Sammlung umfasst:

design-taste-frontend (experimentelles v2) und design-taste-frontend-v1 für den Kern-Skill.
gpt-taste, eine strengere Variante für GPT/Codex.
image-to-code, um visuelle Referenzen in eine Implementierung umzuwandeln.
redesign-existing-projects, um zunächst eine bestehende Oberfläche zu prüfen.
Konkrete visuelle Richtungen: high-end-visual-design, minimalist-ui, industrial-brutalist-ui und stitch-design-taste.
imagegen-frontend-web, imagegen-frontend-mobile und brandkit, die Referenzbilder erzeugen, keinen Code.

Archiv holografischer Ordner in einem dunklen Raum, jeder mit einem Skill-Namen beschriftet: gpt-taste, image-to-code, redesign-existing-projects, minimalist-ui und industrial-brutalist-ui.

Der von den Dokumenten vorgeschlagene Ablauf lautet: einen Skill installieren, einen Auftrag mit visueller Absicht und Einschränkungen formulieren, bei Bedarf visuelle Referenzen erzeugen, mit dem gewählten Agenten implementieren und das Ergebnis anhand der Regeln des Skills prüfen. Für die Überarbeitung eines bestehenden Produkts kehrt die Redesign-Variante die Reihenfolge um: zunächst Hierarchie, Abstände, Layout und Stil prüfen, bevor der Code geändert wird.

Offizieller und semioffizieller Status

Das README erklärt Kompatibilität mit dem Format Vercel Agent Skills und verlinkt vercel-labs/agent-skills; das ist die technische Grundlage für den Befehl npx skills add. Zudem enthält das Repository .claude-plugin/marketplace.json, ein eigenes Manifest für eine Claude-Code-Bibliothek, mit dem Plugin taste-skill in Version 1.0.0.

Das belegt Kompatibilität und einen vom Projekt definierten Marktplatz, aber nicht, dass Taste Skill in einen offiziellen Marktplatz von Anthropic, OpenAI, Cursor oder Vercel aufgenommen wurde. Das README zeigt außerdem ein Badge, das auf Vercels Open-Source-Programm verlinkt, aber die abgerufenen Quellen erlauben es nicht, dieses Badge als Zertifizierung des Inhalts oder als Anbieterempfehlung zu werten. In der Praxis handelt es sich um einen portablen Skill, der in Bezug auf das Vercel-Format semioffiziell ist; es wurde kein Beleg für eine formale Standard-Bezeichnung gefunden.

Das Ökosystem

Forks, Spiegel und Community-Erweiterungen

Eine GitHub-Repository-Suche fand mehrere Projekte, die sich als vom Ansatz inspiriert bezeichnen oder dessen Namen verwenden. Es handelt sich um unabhängige Projekte, keine von Leon Lin genehmigten Erweiterungen, sofern nicht anders angegeben:

gtmvalley/Leonxlnx-taste-skill, ein erklärter Spiegel des ursprünglichen Repositorys; 2 Sterne.
h3nryprod01/design-taste, beschrieben als Synthese aus emilkowalski/skill, pbakaus/impeccable und Taste Skill; 19 Sterne.
phalla-doll/frontend-taste-skill, eine Version, die angibt, die Regler für Varianz, Bewegung und Dichte beizubehalten; 2 Sterne.
lazylizardai/skill-design-taste-frontend, die den Skill für Lovable bewirbt; 5 Sterne.
yojiro253-del/TasteSkill, beschrieben als Design-Skills gegen generische Oberflächen für Agenten; 0 Sterne.

Es wurde keine nicht-englische Übersetzung gefunden, deren Beschreibung oder Dokumentation eine Beziehung zum ursprünglichen Projekt belegt. Ebenso wenig sollte es mit senlindesign/taste-skill (266 Sterne) verwechselt werden, das sich als eigenständiger Skill zur Analyse des Designs von Websites präsentiert, noch mit jaytel0/taste (270 Sterne), das als eine Pipeline zur Erstellung von Skills beschrieben wird.

Zahlen zum Repository

Messung: 6. August 2026, GitHub-API.

Metrik	Wert
Sterne	72.783
Forks	5.003
Echte Abonnenten	238
Von der API gemeldete offene Issues	53
Hauptsprache	JavaScript
Lizenz	MIT
Erstellung	19. Februar 2026
Letzter Code-Push	23. Juli 2026
Letzte Metadaten-Aktualisierung	6. August 2026
Gefundene GitHub Releases	keine

GitHub-Repository-Dashboard im Cyberpunk-Stil mit holografischen Kennzahlen: 72.783 Sterne in Gelb, 5.003 Forks in Cyan und einem Netzwerkgraphen der Mitwirkenden.

Die von der API zurückgegebenen wichtigsten Mitwirkenden waren Leonxlnx mit 138 Beiträgen, gefolgt von devin-ai-integration[bot], jkk442, Osamaali313, Blueemi und luojiyin1987 mit je einem Beitrag. Die allgemeine API wiederholt die Sternenzahl im Feld watchers_count; deshalb weist die Tabelle subscribers_count als echte Abonnenten aus. open_issues_count kann offene Pull Requests einschließen und stellt daher nicht ausschließlich Issues dar.

Wie man beiträgt

Im Hauptzweig gibt es keine CONTRIBUTING.md. Das README lädt aber dazu ein, für Vorschläge und Fehler ein Issue oder einen Pull Request zu eröffnen, und nennt die Kontakte @lexnlin, @blueemi99 und hello@tasteskill.dev.

Die minimal verifizierbare Praxis besteht darin, das Repository zu forken, die Änderung vorzubereiten und auf GitHub einen Pull Request zu eröffnen. Es wurden keine offiziellen Anweisungen zu Basiszweig, PR-Vorlage, Pflichttests oder einem Evaluierungs-Framework gefunden; zusätzliche Anforderungen sollten daher nicht erfunden werden. Das Vorhandensein offener Pull Requests mit umfangreichen Barrierefreiheits- und Performance-Änderungen zeigt, dass die Community Erweiterungen vorschlägt, nicht dass diese akzeptiert wurden.

Wie die Community reagierte

Die abrufbare externe Evidenz ist spärlich und sollte mit Vorsicht gelesen werden:

Düstere Cyberpunk-Szene eines holografischen Terminals, das die GitHub-Issues #28, #15 und #7 mit Textausschnitten zu Installationsproblemen und Beispielen zeigt.

Der Hacker-News-Beitrag 48306196, betitelt als Anti-generisches Oberflächen-Framework für Agenten, verlinkte am 28. Mai 2026 direkt auf das Repository. Veröffentlicht wurde er von steveharing1 und erreichte 3 Punkte und 0 Kommentare. Das belegt Entdeckung, keine Rezension oder unabhängige Begeisterung.
Im Issue #28 berichtete flexchar, dass --skill "taste" keinen Skill fand, obwohl das Tool design-taste-frontend auflistete. Es handelt sich um ein konkretes Installationsproblem: Das Argument muss der Installationsname sein, nicht der informelle Name oder notwendigerweise der Ordnername.
Im offenen Issue #15 bat surajmandalcell um Beispiele für jeden Skill und stellte fest, nur die Startseite als Beispiel zu sehen. Das ist eine konkrete Kritik an der Materialisierung von Beispielen, keine Bewertung der visuellen Wirkung der Sammlung.
Das Issue #7, erstellt von ceetity, verlinkt ceetity/her-skill; sein Vorhandensein zeigt, dass das Repository Vorschläge oder Eigenwerbung von benachbarten Skills erhält, ist aber keine Empfehlung des Maintainers.

Es wurden Suchen auf den angegebenen Reddit-Subforen, X, YouTube, Dev.to, Product Hunt, Paketregistern und Blogs mittels direkter Abfragen versucht. Es wurde keine abrufbare und verifizierbare Evidenz für Beiträge, Videos, einen Product-Hunt-Launch oder Registry-Downloads gefunden. Diese Zugangsbeschränkung erlaubt nicht die Aussage, dass solches Material nicht existiert.

Taste Skill im Vergleich zu anderen Ansätzen

Ansatz	Verifizierbare Übereinstimmung	Verifizierbarer Unterschied
`vercel-labs/agent-skills`	Definiert die Installation über `npx skills add`, die Taste Skill nutzt.	Es ist das Verteilungstool und -format; Taste Skill liefert den Designinhalt.
`senlindesign/taste-skill`	Beide sind Claude-Code-Skills, die sich auf visuelles Urteilsvermögen konzentrieren.	Die Beschreibung von `senlindesign/taste-skill` konzentriert sich auf die Rekonstruktion der Tokens und Entscheidungen einer bestehenden Website; Taste Skill umfasst Implementierung, visuelle Stile und Referenzerzeugung.
`jaytel0/taste`	Beide arbeiten an der Erstellung von Design-Urteils-Skills.	`jaytel0/taste` wird als Pipeline zur Erstellung von Skills beschrieben; die abgerufenen Quellen stellen Taste Skill als installationsfertige Sammlung dar.
`h3nryprod01/design-taste`	Behauptet, Taste Skill in eine Synthese von Design-Skills einzubinden.	Es ist eine Community-Synthese mehrerer Quellen; es ist nicht das von Leon Lin gepflegte Repository.

Der Vergleich ist kein Leistungstest: Es wurde weder eine gemeinsame Testumgebung noch unabhängige Messungen gefunden, die es erlauben würden, eine Option als visuell überlegen zu bezeichnen.

Kurzanleitung zur Nutzung

Installation und erster Start

Voraussetzung: Node.js mit verfügbarem npx sowie ein Agent oder Workflow, der kompatible Skills laden kann. Um die gesamte Sammlung zu installieren:

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

Um nur den Haupt-Skill zu installieren, verwenden Sie den exakten Installationsnamen:

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

Das Tool durchsucht skills/ und kopiert oder registriert die erkannten Skills. Alternativ erlaubt das README, eine SKILL.md in das Projekt zu kopieren oder sie in eine ChatGPT- oder Codex-Konversation einzufügen. In Claude Code gibt es zudem ein Marktplatz-Manifest unter .claude-plugin/, aber das README liefert hierfür keinen spezifischen Installationsbefehl.

Übliche Arbeitsabläufe

Eine Oberfläche von Grund auf erstellen: design-taste-frontend installieren, Seitentyp, Zielgruppe, Referenzen und Einschränkungen angeben; der Skill definiert eine Lesart des Auftrags und wendet vor der Implementierung die drei visuellen Regler an.
Eine konkrete Richtung anwenden: je nach Fall minimalist-ui, industrial-brutalist-ui oder high-end-visual-design installieren und zusammen mit dem Haupt-Skill verwenden, um die ästhetische Richtung einzugrenzen.
Ein bestehendes Produkt neu gestalten: redesign-existing-projects installieren; der dokumentierte Prozess beginnt mit der Prüfung von Layout, Abständen, Hierarchie und Stil, statt die Oberfläche sofort zu überschreiben.
Vom Bild zum Code gehen: imagegen-frontend-web oder imagegen-frontend-mobile installieren, um Referenzen zu erzeugen; diese anschließend an Codex, Cursor oder Claude Code übergeben. Für den vollständigen Ablauf schlägt das README vor, explizit zu formulieren: follow the skill: generate images, then analyze, then code mit image-to-code.

Wesentliche Konfiguration

Im Haupt-Skill sind die ersten Regler Werte von 1 bis 10:

DESIGN_VARIANCE: regelt, wie weit sich die Komposition von einem zentrierten, konventionellen Layout entfernt.
MOTION_INTENSITY: regelt die Tiefe der Animation, von Hover-Interaktionen bis zu Scroll- oder Magnet-Effekten.
VISUAL_DENSITY: regelt die Menge sichtbarer Information, von großzügigem Weißraum bis zu dichten Panels.
Skill-Name in --skill: verwenden Sie design-taste-frontend, gpt-taste oder den Namen aus der Tabelle des READMEs, keine beiläufige Abkürzung.
CHANGELOG.md: konsultieren Sie diese Datei vor einem Update, wenn Ihr Projekt vom Verhalten von v1 oder des experimentellen v2 abhängt.

Häufige Fallstricke und Lösungen

taste wird nicht gefunden: Issue #28 dokumentiert, dass taste nicht der Installationsname ist. Führen Sie den Befehl mit --skill "design-taste-frontend" aus oder installieren Sie das gesamte Repository.
Das Ergebnis hat sich beim Update geändert: Das experimentelle v2 ersetzt v1 unter demselben Namen design-taste-frontend. Um das vorherige Verhalten festzulegen, installieren Sie design-taste-frontend-v1.
Code von einem Bild-Skill erwarten: imagegen-frontend-web, imagegen-frontend-mobile und brandkit erzeugen visuelle Referenzen; sie implementieren die Oberfläche nicht selbst. Übergeben Sie die Bilder an einen Code-Agenten oder verwenden Sie image-to-code.
Nicht wissen, was jeder Skill tut: Die Bitte um Beispiele aus Issue #15 bleibt offen. Nutzen Sie die Skill-Tabelle des READMEs und prüfen Sie die entsprechende SKILL.md, bevor Sie mehrere Anweisungen kombinieren.

Integrationen und Migration

Die Hauptintegration ist das Vercel-Agent-Skills-Format über npx skills add, mit deklarierter Verwendung zusammen mit Codex, Cursor und Claude Code. Für ChatGPT Images oder einen Codex-Bildmodus schlägt das README vor, einen Skill zur Bilderzeugung anzuhängen oder einzufügen, Frames zu erzeugen und diese Ergebnisse als Eingabe für den Implementierungsagenten zu verwenden. Die Migration von v1 zu v2 erfolgt durch Wiederholen des Installationsbefehls für design-taste-frontend; der Name bleibt gleich und die Datei wird ersetzt. Um v1 zu erhalten, installieren Sie den expliziten Namen design-taste-frontend-v1.

Anwendungsfälle und wem dieses Repository helfen kann

Produktdesigner und Entwickler, die mit einem Agenten eine erste Version einer Seite erstellen, können subjektive Referenzen und Einschränkungen in überprüfbare Anweisungen umwandeln: Seitentyp, visuelle Richtung, Dichte, Varianz und Bewegung.
Teams, die eine bestehende Oberfläche überarbeiten, können den Redesign-Skill nutzen, um eine vorherige Prüfung zu erzwingen und zu verhindern, dass ein Agent Stile ändert, ohne Hierarchie, Abstände und Kontext zu prüfen.
Personen, die mit Referenzbildern arbeiten, können Web-, Mobil- oder Markenboard-Screens erstellen und diese anschließend an Codex, Cursor oder Claude Code zur Implementierung übergeben; diese Trennung von Bild und Code ist ausdrücklich dokumentiert.
Teams mit einer bestehenden, auf v1 aufgebauten Basis können kontrolliert zu v2 migrieren oder v1 mit separaten Installationsnamen fixieren, statt anzunehmen, dass ein Update genau dasselbe Verhalten beibehält.
Maintainer von Oberflächen, die auf bekannten Designsystemen basieren, können die v2-Regel nutzen, die auf offizielle Pakete verweist, wenn der Auftrag Material, Fluent, Carbon oder andere Systeme identifiziert, statt den Agenten um eine nicht deklarierte Nachahmung zu bitten.

Ressourcen

Repository: https://github.com/Leonxlnx/taste-skill
Website und Dokumentation: https://tasteskill.dev/
Offizielle Installation und Skills: https://github.com/Leonxlnx/taste-skill#installing
Offizielles Änderungsprotokoll: https://github.com/Leonxlnx/taste-skill/blob/main/CHANGELOG.md
Skills-Format und -Tool: https://github.com/vercel-labs/agent-skills
Claude-Code-Manifest: https://github.com/Leonxlnx/taste-skill/tree/main/.claude-plugin
Hacker-News-Diskussion: https://news.ycombinator.com/item?id=48306196
Zitierte Issues: https://github.com/Leonxlnx/taste-skill/issues/28, https://github.com/Leonxlnx/taste-skill/issues/15
Kontakt und Community: https://github.com/Leonxlnx/taste-skill#feedback—contributions

Hinweis: Dieser Artikel kombiniert das README, CHANGELOG.md, die Manifeste des Repositorys, die GitHub-API, die GitHub-Repository-Suche, Issues und Hacker News, abgerufen am 6. August 2026. Zahlen ändern sich mit der Zeit; externe Suchen ohne abrufbare Evidenz werden nicht als endgültige Abwesenheit dargestellt.