LinkRaillyTool
Coding-Assistenten generieren häufig unpassende Styles, wenn Designregeln nur vage im Prompt beschrieben sind. Tinte standardisiert Token und Kompositionsregeln so, dass Agents sie als deterministische Vorgaben und API konsumieren können.
Das Projekt schließt eine Lücke zwischen Design-Systemen und LLM-gestützter Entwicklung. Anstatt Prompt-Fragmente manuell zu pflegen, nutzt Tinte eine zentrale tinte.config.json für drei Aufgaben: Agent-Instruktionen, Code-Validierung per Linter und Developer-Tooling (Editor-Themes). Besonders bemerkenswert ist die direkte Integration in den .agents/skills/-Workflow sowie der rigorose Linter, der Design-Abweichungen bereits in der Pipeline stoppt.
Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 5. Oktober 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.
Inhaltlich ähnlich, ermittelt über die KI-Suche.
Link:Magentix Studio
Design Extractor analysiert öffentliche Websites und fasst deren Design-System in einer strukturierten DESIGN.md-Datei zusammen. Das Format kombiniert maschinenlesbare YAML-Tokens mit Erläuterungen in Markdown, damit KI-Coding-Agenten wie Claude Code oder Cursor konsistente Frontends erstellen können.
Link:Impeccable AI
Impeccable ist ein Design-Skill und Plugin für KI-gestützte Coding-Agenten wie Claude oder Cursor. Es stattet LLMs mit einem standardisierten Design-Vokabular aus, erkennt typische KI-Designfehler und bindet bestehende Design-Systeme direkt in den Code ein.
Repository:amaancoderx/npxskillui
SkillUI ist ein Node.js-Kommandozeilenwerkzeug, das Design-Systeme aus Webseiten, lokalen Projekten oder Git-Repositories extrahiert. Ohne KI-Modelle oder API-Schlüssel sammelt es Farben, Schriften, Abstände, Komponenten und Screenshots und bereitet diese als Kontextdateien für Claude Code auf.
2020SterneTypeScript
X-Post:Tom Dörr
Tom Dörr empfiehlt SkillUI, ein quelloffenes CLI-Werkzeug, das vollständige Design-Systeme von Websites oder aus Codebases extrahiert und für Claude Code aufbereitet.
335Lesezeichen13.542Aufrufe
Link:eyedropper.design
Eyedropper extrahiert Design-Tokens wie Farben, Typografie und Abstände direkt aus bestehendem Code und stellt diese KI-Agenten über das Model Context Protocol (MCP) zur Verfügung. Generierter Frontend-Code wird automatisch gegen das Design-System validiert, um Abweichungen vom Markenauftritt zu verhindern.
Repository:shadcn-ui/lint
shadcn/lint ist ein Linter für Tailwind CSS (v4), der Design-System-Regeln so formuliert, dass KI-Coding-Agenten sie direkt verstehen und korrigieren können. Statt kryptischer Typprüfungen liefert das Tool Fehlermeldungen mit konkreten Handlungsempfehlungen.
2178SterneTypeScript
Dieser Inhalt wurde teilweise mithilfe von KI erstellt.
