Hallmark erklärt: der Design-Skill mit 50 Themes gegen KI-Einheitslook

Was ist Hallmark? Hallmark ist ein Skill, also eine Anleitung samt Referenzdateien, die Coding-Agenten beim Bau von Websites lädt, damit das Ergebnis gestaltet statt generiert wirkt. Er kombiniert harte Verbote wie «kein violett-blauer Verlauf, keine Emoji als Icons, keine erfundenen Kennzahlen» mit einem Katalog von 50 Gestaltungswelten, den Themes.

Hinter dem Projekt steht laut README Together AI. Der Skill funktioniert mit Claude Code, Codex CLI, Cursor und OpenCode.

Warum Hallmark gerade so gefragt ist

Das Repository Nutlope/hallmark wurde am 27.04.2026 angelegt und hatte am 04.11.2026 47'499 Sterne und 2'513 Forks; im Oktober kamen laut GitHub-Trends rund 17'300 Sterne dazu (Stand 04.11.2026, Quelle: GitHub). Auslöser war Version 2: Laut Commit-Verlauf wurde sie am 22.10.2026 gemergt, am 27.10. folgte der Ausbau auf «fifty themes». Das README listet als Neuerungen 50 Themes, Seiten nach dem Zweck des Besuchs, einen Custom-Modus, Screenshots des echten Produkts, 755 frei lizenzierte Fotos sowie die Befehle redesign und audit.

So funktioniert es

Der Ablauf in SKILL.md hat sieben Schritte:

1. Pre-flight: Projekt lesen (Schriften, Farben, Framework, eine allfällige design.md).
2. Einmal fragen: Material, Publikum, Ziel, Ton. Fakten wie Kundenzahlen werden nie erfunden.
3. Form: Was will der Besucher tun? Buchen, kaufen, anfragen. Die Datei anatomy.md beschreibt, wo echte Seiten der Branche die Handlung platzieren.
4. Richtung: Ein Skript zieht drei passende Themes, der Agent wählt eines.
5. Picks-Block: alle Entscheide auf einen Blick.
6. Bau: erst der Hero, dann der Rest, mit einem Stempel im CSS.
7. Sweep: Linter im Browser bei acht Breiten, danach ein Review durch einen frischen Subagenten.

Die Regeln sind in Stufen sortiert. Der «Floor» ist nie verhandelbar (Kontrast, Fokus, reduzierte Bewegung, keine erfundenen Fakten, kein Eyebrow-Label über Überschriften). «Reflex»-Regeln dürfen mit Begründung im Stempel übergangen werden, «Finish»-Punkte blockieren nie.

Installation

Laut README:

npx skills add nutlope/hallmark -g

Ohne -g landet der Skill nur im aktuellen Projekt. Für die Browser-Prüfungen nennt das README zusätzlich npm i -g puppeteer-core und Chrome. Als Claude-Code-Plugin geht es laut README mit /plugin marketplace add nutlope/hallmark und danach /plugin install hallmark@hallmark. Aufgerufen wird er mit /hallmark und einem Auftrag, bestehende Seiten mit /hallmark redesign und dem Pfad.

Unser Test

Skill-Dateien von GitHub (Commit de4999e, Version 2.0.0), angewendet von Claude Opus 5.5 am 04.11.2026, Ergebnis eine Stichprobe von eins. Ausgangslage war dieselbe generische LandingpageEine Landingpage ist eine eigenständige Webseite, die auf genau ein Ziel ausgerichtet ist — eine Anfrage, eine Buchung, einen Download oder einen Kauf — und…Mehr erfahren → der fiktiven «Schreinerei Holzwerk Muster, Winterthur» wie in unseren anderen Tests. Wir haben /hallmark redesign in voller Tiefe gespielt. Die Skripte theme.mjs, sloplint.mjs und capture.mjs haben wir nicht ausgeführt; der Skill sieht für diesen Fall vor, das Theme von Hand aus der Index-Datei zu wählen und als «deal: manual» zu stempeln.

Aus den Kandidaten Atelier, Formwork und Loom fiel die Wahl auf «Atelier», weil dessen Stichwörter Möbel und Handarbeit nennen. Das Theme gibt Farben in OKLCH, die Schriften Sentient (leicht) und Hanken Grotesk, Haarlinien, Karton mit Faserstruktur und genau einen kühlen Schieferton als Akzent vor.

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 →: Sentient 300 für Überschriften, Hanken Grotesk für Text, keine fetten Headlines mehr, keine Grossbuchstaben-Labels.
• Abstände: strenges Raster, die Leistungen als Liste mit Linien statt drei Karten, die Kundenstimme als grosses Zitat ohne Kasten.
• Farben: warmes Kalkpapier, dunkles Umbra für Text, der Akzent erscheint nur bei Unterstreichungen und im Fokusring.
• Hierarchie: Headline auf fünf Wörter gekürzt («Möbel nach Mass aus Winterthur»), ein umrandeter Knopf, die Neuheit als Textlink.
• Bild: ein Foto aus Hallmarks Bibliothek (Hobel mit Spänen, Wikimedia Commons, CC BY-SA 3.0) als Druck im Passepartout, mit Credit im Footer und als Platzhalter markiert.

Auffällig ist, was blieb: Hallmark behandelt bei einem Redesign vorhandene Kennzahlen und Zitate als Material des Betreibers. «500+ zufriedene Kunden» und «100 % Schweizer Qualität» stehen deshalb weiter auf der Seite, nun als ruhige Zahlenreihe, und kommen auf die Prüfliste im Handoff. Das ist eine andere Haltung als bei unslop, das solche Angaben ohne Beleg entfernt.

Was gut war: Das Theme liefert in kurzer Zeit ein stimmiges Gesamtsystem, und die Floor-Regeln sind präzise genug, um sie ohne Interpretation umzusetzen. Was nicht ideal war: Die vom Theme verlangte bewegte WebGL-Luft haben wir nur als Standbild umgesetzt, und an der Unterkante des Hero ist ein leichter Farbsprung sichtbar. Ob der Linter ihn bemängelt hätte, wissen wir nicht, weil er nicht lief.

Beispiele aus der Praxis

• Handwerksbetriebe und Ateliers: Die Themes mit Material-Charakter (Papier, Beton, Stoff) passen gut zu Branchen, die von Anfassbarem leben.
• Agenturen mit vielen Prototypen: Das Logbuch und das Ziehen der Themes sollen laut Skill verhindern, dass zwei Seiten hintereinander gleich aussehen.
• Teams mit bestehender Seite: /hallmark audit liefert nach Stufen sortierte Befunde, ohne Dateien zu ändern.

Grenzen, Risiken, Lizenz

MIT-Lizenz, kostenlos. Die Fotos aus der Bibliothek tragen eigene Lizenzen wie CC BY-SA, die eine sichtbare Nennung verlangen. Für den optionalen Comp-Schritt nennt der Skill einen TOGETHER_API_KEY; dabei verlassen Bildbeschreibungen das Gerät, was im Sinne des Datenschutzgesetzes (DSG) geprüft werden sollte. Die Installation über npx skills add führt fremden Code aus. Wer vorsichtig sein will, liest die Dateien zuerst; worauf zu achten ist, steht in unserem Beitrag zu Claude Code im Unternehmen.

Für wen lohnt sich Hallmark?

Für alle, die neue Seiten mit einem Agenten bauen und eine klare, nachprüfbare Untergrenze plus eine starke Gestaltungsrichtung wollen. Wie Hallmark im direkten Vergleich mit unslop, Impeccable und taste-skill abschneidet, zeigt unser Vergleich der Anti-Slop-Skills. Eine Firmenwebsite, die über Theme-Regeln hinausgeht, entsteht bei unserem Webdesign in Zürich.

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