taste-skill erklärt: Art Direction für Coding-Agenten statt Durchschnittsseite

Was ist taste-skill? taste-skill ist ein Skill für Coding-Agenten, der beim Bau einer Website nicht den Durchschnitt aller gesehenen Seiten liefern soll, sondern eine bewusste Gestaltung. Er gibt eine Art Direction vor, verlangt echte Bilder und prüft die Seite in einem echten Browser auf typische Muster.

Die SKILL.md beschreibt das Problem treffend: eine zentrierte Headline über drei Zeilen, ein kleines Label darüber, eine Reihe Icon-Karten, ein weicher Verlauf. Nichts davon sei falsch, aber nichts davon sei entschieden.

Warum taste-skill gerade so gefragt ist

Leonxlnx/taste-skill wurde am 19.02.2026 angelegt und hatte am 04.11.2026 109'816 Sterne und 7'385 Forks, in der Woche vor unserem Test kamen laut GitHub-Trends rund 6'000 dazu (Stand 04.11.2026, Quelle: GitHub). Laut Changelog brachte Version 2.0.0 am 13.10.2026 den heutigen Ansatz mit Richtungen, Bildsuche und Browser-Prüfung, Version 2.1.0 am 19.10.2026 eigene Regeln für Dashboards und App-Ansichten. Das README verweist zusätzlich auf eine Desktop-App namens TasteCode.

So funktioniert es

Der Ablauf hat zehn Schritte, die wichtigsten:

1. Inventar: acht bis zwölf Dinge, die nur diesem Kunden gehören (Name, Strasse, Material, Rituale, Drucksachen).
2. Argument: Jeder Abschnitt ist eine Behauptung mit Beleg. Abschnitte ohne Behauptung fallen weg.
3. Richtung ziehen: Ein Skript zieht drei von 20 Richtungen, etwa «Der Name als Monument» oder «Die Seite ist das Objekt».
4. Idee: ein Satz nach dem Muster «Auf dieser Seite wird X zu Y», dazu genau ein bedienbares Element mit echtem Inhalt.
5. Bilder: mindestens vier echte Bilder, bevorzugt eigene, sonst aus offenen Sammlungen mit Credit.
6. Prüfen und Ansehen: Messung bei 1440, 768 und 390 Pixeln, dann Kritik anhand der eigenen Screenshots, höchstens drei Runden.
7. Bewegung: Eintritte je Abschnitt, Rückmeldung auf jedem Bedienelement, ein bewegtes Bild.

Die Hausregeln gelten immer: keine Labels über Überschriften, keine Monospace-Schrift ausserhalb von Code, keine Nummerierung 01, 02, 03, keine dünnen Linien, keine Verläufe, keine Schatten auf ruhenden Elementen, höchstens zwei Schriften.

Installation

Laut README:

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

Als Claude-Code-Plugin nennt das README /plugin marketplace add Leonxlnx/taste-skill und /plugin install taste-skill@taste-skill. Die Skripte brauchen Node 22 oder neuer sowie Chrome, Edge oder Chromium.

Unser Test

Skill-Dateien von GitHub (Commit 12af471, Version 2.1.5), angewendet von Claude Opus 5.5 am 04.11.2026, Ergebnis eine Stichprobe von eins. Ausgangslage war die gemeinsame generische Seite der fiktiven «Schreinerei Holzwerk Muster, Winterthur». Die Skripte draw.mjs, assets.mjs, lint.mjs und inspect.mjs haben wir nicht ausgeführt. Stattdessen haben wir die Richtungen und Paletten direkt aus den Bibliotheksdateien gelesen und drei Kandidaten von Hand gezogen: das Objekt gross, die Seite als Objekt und der Musterkatalog.

Gewählt wurde «Die Seite ist das Objekt». Die Idee: Der Werkstattauftrag der Schreinerei wird zur Seite. Als Palette kam «Walnut and tan» aus der Bibliothek, als Schriften Zilla Slab und Work Sans. Die vier Fotos stammen aus Wikimedia Commons und sind im Footer mit Urheber und Lizenz genannt.

Das bedienbare Element verlangt der Skill ausdrücklich, er nennt sogar «pick a wood and see the chair in it» als Beispiel. Bei uns wählt man Möbelart und Holzart, das gezeichnete Sideboard nimmt die Holzfarbe an, der Satz darunter passt sich an, und der Knopf öffnet eine vorbereitete E-Mail.

Was sich geändert hat:

• TypografieTypografie ist die Gestaltung mit Schrift: die Wahl der Schriftarten und ihre Anordnung in Grösse, Zeilenabstand, Zeilenlänge, Gewicht und Hierarchie. Im…Mehr erfahren →: Slab-Schrift für Überschriften, Grotesk für Text, Headline auf zwei Zeilen begrenzt, Footer mit dem Namen in voller Breite.
• Abstände: Abschnitte 160 Pixel auseinander, Leistungen mit Fotos in unterschiedlichen Grössen statt drei gleichen Karten.
• Farben: dunkles Nussbaum, helles Papier, Tan als Feldfarbe, ein Rostrot nur auf den Handlungsknöpfen.
• Hierarchie: Das Formular ist der Hero, die Kennzahlen stehen als ein Satz im Leistungsabschnitt.

Was gut war: Die Regel «Inventar vor Gestaltung» führt tatsächlich weg von der Branchenvorlage, und das Live-Element macht die Seite zum Werkzeug statt zur Broschüre. Was nicht so gut war: Ohne die Messungen von inspect.mjs wissen wir nicht, ob die Seite bei 390 Pixeln besteht. Die geforderte Vorhang-Bewegung im Footer haben wir wieder entfernt, weil sie im Screenshot den Footer verdeckte. Und die Fotos zeigen das Handwerk allgemein, nicht diese Werkstatt; bei einer echten Firma gehören eigene Bilder hinein.

Beispiele aus der Praxis

• Handwerksbetriebe: Ein Konfigurator wie Holzwahl oder Massangabe als bedienbares Element passt zum Skill und liefert Anfragen mit konkretem Inhalt.
• Gastronomie und Hotellerie: Richtungen wie «Der Ort trägt die Seite» oder «Die Seite ist die Speisekarte» passen gut zu Betrieben mit starkem Ort.
• Software-Produkte: Für Produktseiten verlangt der Skill echte Ausschnitte der AppEine App, kurz für Applikation oder Anwendung, ist ein Programm, das eine bestimmte Aufgabe für seine Nutzenden erledigt. Im Alltag meint man damit meist eine…Mehr erfahren → statt grauer Platzhalter-Diagramme.

Grenzen, Risiken, Lizenz

MIT-Lizenz, kostenlos, laut README ohne API-Schlüssel. Die Bildsuche fragt externe Archive ab; die Suchbegriffe verlassen also das Gerät. Gefundene Bilder tragen eigene Lizenzen wie CC BY-SA, die eine Nennung verlangen. Die Skripte starten einen Browser und einen lokalen ServerEin Server ist ein Computer oder ein Programm, das anderen Geräten Dienste bereitstellt: Er liefert Websites aus, speichert Daten, verschickt E-Mails oder…Mehr erfahren →; vor dem ersten Lauf lohnt ein Blick in den Quelltext. Was dabei zu beachten ist, steht in unserem Leitfaden zu Landingpages mit KI.

Für wen lohnt sich taste-skill?

Für alle, die mit einem Agenten eine neue, eigenständige Seite bauen und bereit sind, 30 bis 45 Minuten pro Lauf zu investieren. Den direkten Vergleich mit Hallmark, Impeccable und unslop zeigt unser Vergleich der Anti-Slop-Skills. Wer eine fertige Website für sein Handwerk sucht, findet bei unserem Webdesign für Handwerker den passenden Einstieg.

Weitere Projekte aus dieser Serie finden Sie in der Übersicht über alle 20 GitHub-Trends vom November 2026.