Skills: Agenten-Toolkit zur Optimierung von UI und UX

LinkJakub KrehelTool

Jakub Krehel stellt eine Sammlung spezialisierter Agent Skills vor, die Frontend-Teams bei Interface-Details wie Typografie, OKLCH-Farben, Barrierefreiheit, Layouts und Microcopy unterstützen.

Das Wichtigste

  1. Installation der Sammlung erfolgt über den CLI-Befehl 'npx skills add jakubkrehel/skills'.
  2. /better-ui verbessert Interface-Details wie konzentrische Border-Radien, optische Ausrichtung, Klickflächen und Tiefenwirkung.
  3. /better-colors unterstützt bei der Migration zu OKLCH, Farbkontrasten, Gamut-Clamping und Fallbacks.
  4. /better-accessibility prüft Tastaturnavigation, Fokus-Zustände, ARIA-Attribute und Screenreader-Kompatibilität.
  5. /better-typography optimiert Type Scales, Abstände, Variable Fonts und Zeilenumbrüche.
  6. /better-writing überarbeitet Produkttexte, Fehlermeldungen, Onboarding und Empty States.

Warum das relevant ist

KI-Coding-Assistenten generieren oft funktionalen, aber visuell und ergonomisch unfertigen Frontend-Code. Modulare Skills geben Agenten klare Richtlinien und Kriterien an die Hand, um Designqualität, Barrierefreiheit und Textfluss systematisch zu heben.

Einordnung

Das Toolkit bricht UI/UX-Optimierung in handhabbare Einzeldomänen herunter. Statt allgemeiner Prompts fokussieren spezialisierte Kommandos wie /better-colors oder /better-writing auf konkrete Best Practices, etwa modernen Farbräumen (OKLCH) oder klar verständlichen Fehler-Dialogen. Zusätzliche Utility-Skills wie /break erleichtern das Aufspüren von Grenzfällen in Komponenten.

Gefunden in

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:Adham Dannaway

    Agent Design Skills: UI-Feinschliff und Barrierefreiheit für KI-Agenten

    Designer Adham Dannaway empfiehlt eine Sammlung spezialisierter Agent-Skills von Jakub Krehel. Das Paket erweitert KI-Agenten um konkretes Fachwissen in den Bereichen UI-Design, Typografie, OKLCH-Farben, Barrierefreiheit, Layout und Product Writing.

    492Lesezeichen28.585Aufrufe

    KI & AI· Sammlung

  • Repository:jakubkrehel/skills

    jakubkrehel/skills: Agent-Skills für UI- und Design-Engineering

    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

    KI & AI· Tool

  • Link:cuellarfr

    Design Skills: Kuratierte UI- und UX-Skills für KI-Agenten

    cuellarfr/design-skills stellt zehn strukturierte Wissenspakete für Entwicklungsagenten wie Claude Code, Cursor, Codex und OpenCode bereit. Die Sammlung deckt Disziplinen von UX Research über Barrierefreiheit bis hin zu Design Systems und UX Writing ab.

    KI & AI· Sammlung

  • X-Post:Kiyotaka

    Fünf UI-Skills für Design Engineers mit KI-Coding-Agenten

    Kiyotaka (@SubhanHQ) empfiehlt fünf spezialisierte Regelwerke („Skills“) für KI-Agenten, die Frontend-Entwicklern bei UI-Polishing, Animationen, Barrierefreiheit und visueller Präzision helfen.

    986Lesezeichen39.486Aufrufe

    KI & AI· Sammlung

  • Link:Tailwind Labs

    ui.sh: KI-Agenten-Fähigkeiten für Interface-Entwickler

    Die Macher von Tailwind CSS und Refactoring UI haben mit ui.sh eine Sammlung aufgabenorientierter Prompts und Workflows für KI-Agenten vorgestellt. Das Toolkit soll Entwicklern helfen, hochwertige Benutzeroberflächen zu erstellen.

    KI & AI· Tool

Sprechen wir über Ihr Projekt.

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Ein Teil von diesem Inhalt wurde mit KI gemacht.