Repositoryamaancoderx/npxskilluiTool
Große Sprachmodelle scheitern oft daran, bestehende Benutzeroberflächen visuell exakt nachzubauen, weil ihnen präzise Design-Tokens und visuelle Anhaltspunkte fehlen. SkillUI schließt diese Lücke, indem es die visuelle Identität einer bestehenden Seite strukturiert erfasst und direkt als Arbeitsanweisung für KI-Assistenten bereitstellt.
Das Tool löst ein konkretes Problem beim Frontend-Prototyping mit KI-Unterstützung. Anstelle manueller Copy-Paste-Arbeit von Farbcodes und Layouts automatisiert SkillUI die Vorbereitung des Kontextfensters für Claude Code. Technologisch basiert das CLI auf Node.js (ab Version 18), TypeScript und optional Playwright. Es richtet sich primär an Frontend-Entwickler, die Claude Code nutzen, um Oberflächen basierend auf Referenzdesigns zu generieren. Mit über 2.000 Sternen auf GitHub und npm-Paketen wirkt das Projekt aktiv genutzt, befindet sich jedoch im Stadium eines spezialisierten Entwicklerwerkzeugs.
Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 27. September 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.
Inhaltlich ähnlich, ermittelt über die KI-Suche.
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
Repository:jakubkrehel/skills
jakubkrehel/skills ist eine kuratierte Sammlung modularer Agent-Skills, die KI-Assistenten wie Claude Code fundiertes Wissen über Interface-Design, Typografie, Barrierefreiheit und UI-Engineering bereitstellen.
5773SterneMarkdown
Repository:per-simmons/clone-app-pat-pro-public
clone-app-pat-pro ist ein Skill für Claude Code, der Web-Apps anhand einer URL exakt nachbaut. Statt Layouts anhand von Screenshots zu schätzen, analysiert das Tool den realen gerenderten Code, extrahiert Design-Tokens, lädt Assets herunter und prüft die Kopie automatisiert über berechnete CSS-Werte.
245SterneJavaScript
Repository:elayadesign/ai-design-skills
Das GitHub-Repository elayadesign/ai-design-skills bündelt strukturierte Design-Anleitungen und Regelwerke im Markdown-Format für KI-gestützte Coding-Tools. Entwickler können diese Skills in Assistenten wie Claude Code, Cursor oder Windsurf einbinden, um konsistentere Landingpages und UI-Systeme zu generieren.
1960Sterne
Repository:Nutlope/hallmark
Hallmark ist ein von Together AI entwickeltes Open-Source-Skill für Claude Code, Cursor und Codex. Das Werkzeug verhindert typische, austauschbare KI-Designs («AI-Slop») durch Makrostrukturen, 21 Themes, 57 Testregeln und automatisierte Selbstkritik vor der Ausgabe.
28.417SterneCSS
Repository:display-dev/visualize
visualize ist ein Open-Source-Skill für KI-Coding-Assistenten wie Claude Code, Cursor oder Codex, um typische KI-Standard-Designs bei generierten HTML-Dokumenten durch markenkonforme Vorlagen und definierte Überarbeitungsbefehle zu ersetzen.
67SterneHTML
Dieser Inhalt wurde teilweise mithilfe von KI erstellt.
