Die Besten Claude Skills für Designer (2026): Marketplace, MCP, Installation & Vollständiger Guide

1. Was Claude Skills sind (und was nicht)

Die offizielle Definition

Skills sind Ordner mit Anweisungen, Skripten und Ressourcen, die Claude dynamisch lädt, um die Leistung bei speziellen Aufgaben zu verbessern. Skills bringen Claude bei, bestimmte Aufgaben wiederholbar zu erledigen – egal ob es darum geht, Dokumente nach den Markenrichtlinien deines Unternehmens zu erstellen, Daten anhand der spezifischen Workflows deiner Organisation zu analysieren oder persönliche Aufgaben zu automatisieren. Der Unterschied zu einem einfachen System-Prompt liegt in der Beständigkeit und Struktur: Ein Skill ist ein Ordner mit einer SKILL.md-Datei und bleibt bestehen; ein Prompt ist eine einmalige Nachricht, die nicht erhalten bleibt.

Anthropic hält das Ganze bewusst einfach. Skills sind keine Modelle, keine Plugins im WordPress-Sinne und keine kostenpflichtigen Zusatzfunktionen. Es handelt sich um Open-Source-Markdown-Anweisungen plus unterstützende Dateien.

Bau dir deinen Claude-Skills-Stack auf. Und behalte mehr von dem, was du dafür ausgibst. Bleap: 0% Fremdwährungsgebühren auf USD-Abos und pauschal 20% Cashback auf Claude, ChatGPT und Gemini. Selbstverwahrte Mastercard, keine monatliche Gebühr. Bleap-Konto eröffnen →

Skills vs. MCP vs. Plugins vs. manuelle Prompts

Für Designer, die entscheiden müssen, welcher Ansatz passt, hilft folgendes Denkmodell am besten: Skills enthalten das Vorgehen, Tools führen die Aktionen aus, MCP stellt den Zugriff bereit.

Skills sind unschlagbar, wenn es um Wiederholbarkeit und Teamarbeit geht, denn dasselbe SKILL.md-Format läuft auf claude.ai, der Claude API, Claude Code und selbst gehosteten Agenten. Einmal schreiben, überall im Team einsetzen.

Der Claude Skills Marketplace auf einen Blick

Offizielle Skills kommen direkt von Anthropic. Das sind Skills, die Anthropic selbst entwickelt und pflegt, etwa die verbesserte Dokumentenerstellung für Excel-, Word-, PowerPoint- und PDF-Dateien. Anthropic-Skills stehen allen Nutzern zur Verfügung, und Claude ruft sie automatisch auf, wenn sie gebraucht werden. Darüber hinaus gibt es eine breitere, Claude-kompatible Landschaft aus Partner-Skills, Skills von Drittanbietern und Community-Skills. Diese können sich in Verpackung und Pflege unterscheiden, sind aber trotzdem darauf ausgelegt, ähnliche Agenten-Workflows zu unterstützen. Achte auf Vertrauenssignale wie ein Anthropic-verifiziertes Abzeichen, ein aktuelles Datum der letzten Aktualisierung und einsehbaren Quellcode.

2. Die besten Claude Skills für Design: Kuratierte Rangliste

Methodenhinweis: Diese Liste ist nach praktischem Nutzen, Verbreitung in der Community und Passgenauigkeit zu einem echten Design-Workflow sortiert – nicht nach Marketing-Glanz. Da das Ökosystem erst wenige Monate alt ist, solltet ihr die Platzierungen eher als Orientierung verstehen. Ein Frontend-Designer und ein research-lastiger UX-Designer würden diese Liste wahrscheinlich anders sortieren.

Frontend Design AI liegt auf Platz eins, weil Code-Generierung die Aufgabe mit dem größten Hebel ist, die die meisten Design Engineers täglich wiederholen. Figma-Integration und UI/UX Pro folgen direkt dahinter, weil Übergaben und Feedbackrunden genau die Punkte sind, an denen Teams am meisten Zeit verlieren. AccessLint landet nur auf Platz vier, weil noch nicht jedes Team Barrierefreiheit als oberste Priorität behandelt – auch wenn der Abschnitt weiter unten dafür plädiert, dass es für viele Teams eigentlich weiter oben stehen sollte. Die letzten vier sind Spezialtools, die du erst dazuholst, wenn dein Kern-Stack stabil läuft.

3. Deep-Dive: Die besten Claude Design Skills im Detail

Frontend Design AI Tools Skill

Dieser Skill erzeugt aus einem schriftlichen Design-Briefing produktionsreifes HTML, CSS und Tailwind. Seine Stärken liegen im Aufbau von Komponenten-Gerüsten, responsiven Utility-Klassen und der Einhaltung eines Design-Systems, das man ihm vorgibt. Ideal ist er für Frontend-Designer oder Design-Engineers, die bereits in Komponenten denken und sich die lästige Grundgerüst-Arbeit sparen wollen.

Die Schwachstelle liegt in der Qualität der Eingaben. Der Skill braucht klar definierte Design-Tokens – ist eure Abstandsskala, sind die Farbvariablen und die Typo-Abstufung vage formuliert, wird auch das Ergebnis vage. Füttert ihn mit strukturierten Tokens, und er liefert gute Arbeit. Sagt ihr ihm nur "mach's modern", fängt er an zu raten.

Figma-Claude-Integration

Die Verbindung zu Figma läuft über eine API-Anbindung, nicht über ein natives Figma-Plugin – das sollte man bei den Erwartungen im Hinterkopf behalten. Claude wird also mit Figma-Daten verknüpft, läuft aber nicht direkt im Figma-Canvas. Einsatzmöglichkeiten sind das automatische Erstellen von Komponenten-Spezifikationen, das Extrahieren von Design-Tokens und das Entwerfen von Figma-Kommentaren während des Reviews. Empfehlenswert ist die Nutzung im Figma Dev Mode, da dieser die strukturierten Maße und Variablen offenlegt, mit denen der Skill am besten arbeitet.

UI/UX Pro Skill

UI/UX Pro übernimmt Wireframe-Kritik, Vorschläge für User-Flows und heuristische Bewertungen. Was ihn von einer x-beliebigen "UX-Prompt-Vorlage" unterscheidet, ist die Struktur: Er wendet bei jedem Review dieselben Bewertungskriterien an, sodass die Kritik in Woche eins zur Kritik in Woche zwei passt. Genau für diese Konsistenz sind Skills gemacht, denn sie verbessern Claudes Zuverlässigkeit, Geschwindigkeit und Leistung bei zahlreichen Aufgaben. Am meisten Kontext holt man heraus, wenn man ihn mit der Figma-Integration oder einem Whiteboard-Tool kombiniert.

AccessLint Claude Skill

AccessLint verfolgt einen WCAG-basierten Linting-Ansatz, und der Claude Skill legt eine Ebene mit Verbesserungsvorschlägen in natürlicher Sprache über die reine Fehlererkennung. Statt einen Kontrastfehler nur zu markieren und es dabei zu belassen, erklärt der Skill das Problem, bewertet den Kontrast und schlägt in verständlicher Sprache aria-label-Korrekturen vor. Wer Accessibility von Anfang an mitdenkt, sollte dieses Tool früh installieren, denn Probleme im Design-Stadium zu entdecken ist deutlich günstiger, als sie nachträglich in der Entwicklung auszubessern.

Design Token Manager & Component Doc Generator

Der Token Manager synchronisiert Design-Entscheidungen zwischen Figma-Variablen und Code und sorgt so für eine einzige verlässliche Quelle, während sich euer System weiterentwickelt. Der Doc Generator erstellt automatisch Komponenten-Dokumentation im Storybook-Stil. Zusammen ermöglichen sie einen richtig runden Workflow in einer einzigen Session: Ihr definiert ein Token, erzeugt die Komponente, die es verwendet, und lasst anschließend die Dokumentation erstellen – alles ohne Claude zu verlassen. Genau so sollen Skills funktionieren, denn sie laden bei Bedarf nach (progressive disclosure), sodass auch eine ganze Reihe von ihnen das Context-Fenster nicht verstopft.

4. So installierst du Claude Skills

Installation über Claude.ai (Web-UI)

In der Web-App läuft das Ganze in drei Schritten ab: durchsuchen, installieren, bestätigen. Öffne den Marketplace-Bereich, suche nach dem Plugin, klicke auf „Install“, prüfe die Berechtigungen und autorisiere die Installation. Wichtig dabei: Du brauchst einen Claude Pro- oder Team-Account auf claude.ai. Im kostenlosen Tarif gibt es weder Cowork noch Marketplace-Zugang. Installierte Skills tauchen dann in deiner Seitenleiste auf, und du kannst sie ganz einfach ein- oder ausschalten, damit in einer Unterhaltung wirklich nur die relevanten Skills geladen werden.

Installation über die Claude Code CLI

Für Designer:innen und Design-Engineers, die im Terminal zu Hause sind, ist Claude Code der schnellste Weg. Claude Code bringt ein eingebautes Plugin-System mit, über das du Skills direkt im Terminal durchsuchen, installieren und verwalten kannst. Der grundlegende Ablauf läuft über den Plugin-Befehl:

/plugin marketplace add owner/repo
/plugin install skill-name@marketplace-name
/plugin list

Skills werden beim Start geladen. Starte Claude Code neu und führe den Doctor-Befehl aus, um die Installation zu überprüfen – dort solltest du deinen Skill unter „Loaded Skills“ mit einem grünen Häkchen sehen. Bei projektbezogenen Skills lohnt es sich, sie ins Versionskontrollsystem einzuchecken, damit das ganze Team automatisch davon profitiert: Projekt-Skills in .claude/skills/ können problemlos versioniert werden. Die meisten Installationsfehler liegen übrigens an der falschen Ablage – prüfe also genau, ob die Datei SKILL.md am richtigen Ort liegt und der Ordner direkt in ~/.claude/skills/ liegt (und nicht eine Ebene zu tief verschachtelt ist).

Installation über die API (für Teams & Automatisierung)

Design-Ops-Teams, die Skills in interne Tools einbinden möchten, sollten dafür die API nutzen. Die Skills-Funktion ist sowohl in Claudes Web-App als auch in der Claude-Code-Umgebung und der API verfügbar. Unternehmen können darüber eigene Skills über einen neuen /v1/skills-Endpunkt erstellen, Versionen in der Konsole verwalten und sie in ihre Workflows integrieren. Eine Voraussetzung, die man einplanen sollte: Skills benötigen das Code Execution Tool, das die sichere Umgebung für ihre Ausführung bereitstellt. Rate Limits und Kontingente sollte man dabei genauso einkalkulieren wie bei jeder anderen produktiven API-Integration auch.

5. Wo man die besten Claude Skills für Designer findet

Der offizielle Anthropic Skills Marketplace

Am besten fängst du hier an und filterst nach designrelevanten Kategorien. Offizielle Skills bieten die stärksten Vertrauenssignale: eine von Anthropic verifizierte Quelle, eine sichtbare Installationszahl und ein aktuelles Update-Datum. Anthropic betreibt außerdem ein öffentliches Repository, das Anthropics eigene Implementierung von Skills für Claude enthält und zeigt, was mit dem Skills-System von Claude alles möglich ist.

GitHub & Open-Source-Verzeichnisse

In den Community-Verzeichnissen findest du die größte Vielfalt. Manche Repos sind riesig und bündeln Hunderte von Skills aus verschiedenen Disziplinen – installierbar gleichzeitig über mehrere Agenten. Bevor du einen GitHub-gehosteten Skill installierst, lies die README, schau dir die offenen Issues an und prüfe die Sternezahl sowie die Aktualität der Commits. Ein unfertig gepflegtes Repo solltest du genauso behandeln wie verwaisten Open-Source-Code.

Community-Hubs (Discord, Reddit, Product Hunt)

Designer-spezifische Channels auf Discord, Subreddits und Product-Hunt-Launches liefern echte Empfehlungen und ehrliche Kritik oft schneller als jedes Marketplace-Listing. Falls es für dein Bedürfnis noch keinen passenden Skill gibt, poste einfach eine Anfrage – bei diesem jungen Ökosystem baut oft schon jemand genau daran. Auch kuratierte Marktplätze entstehen gerade, manche mit automatisiertem Sicherheitscheck, bevor ein Skill live geht, sodass du weißt, dass das, was du installierst, bereits geprüft wurde.

Nutzt du Claude Pro zusammen mit ChatGPT und Gemini, um Skills über verschiedene Tools hinweg zu vergleichen? Mit Bleap zahlst du 0% FX-Gebühren auf diese USD-Abos und erhältst pauschal 20% Cashback auf die Verlängerungen von Claude, ChatGPT und Gemini. Kein eigenes Monatsabo nötig. Hol dir die Bleap-Karte →

6. Einen skalierbaren Design-Workflow mit Claude Skills aufbauen

Die Drei-Schichten-Architektur für Skills

Ein wirklich langlebiges Setup unterteilt Skills in drei Schichten:

• Referenzschicht: Skills, die Claude mit deinem Design-System-Wissen füttern, etwa Tokens und Markenrichtlinien. Sie vermitteln Kontext.
• Fähigkeitsschicht: Skills, die konkrete Aufgaben übernehmen, wie Code-Generierung, Barrierefreiheits-Checks oder Textentwürfe. Sie erledigen die eigentliche Arbeit.
• Verbindungsschicht: Skills und MCP-Connectoren, die Ergebnisse mit externen Tools wie Figma, GitHub und Notion synchronisieren. Sie transportieren die Resultate weiter.

Wenn du diese drei Schichten sauber trennst, bleibt dein Stack übersichtlich. Und falls mal etwas nicht funktioniert, weißt du sofort, ob das Problem beim Kontext, bei der Fähigkeit oder bei der Verbindung liegt.

Ein typischer Tag im Leben eines UI-Designers

So könnte ein realistischer Arbeitstag aussehen: Du startest morgens damit, UI/UX Pro deine Wireframes kritisieren zu lassen. Beim Design-Handoff nutzt du die Figma Claude Integration, um Specs zu extrahieren. Vor der Entwicklung lässt du AccessLint Claude einen Barrierefreiheits-Check durchführen. Und zum Schluss übergibst du dem Component Doc Generator deine fertigen Komponenten zur Dokumentation. Vier Skills, vier klar unterscheidbare Momente – und trotzdem eine durchgehende Session.

Setup für Teams vs. Einzelkämpfer

Teams sollten die Governance zentralisieren und dafür gemeinsame Workspace-Skills nutzen, idealerweise versionskontrolliert, damit alle mit demselben Verhalten arbeiten. Genau hier zahlt es sich aus, Skills in ein Repository einzuchecken: Teammitglieder bekommen die Skills automatisch beim Pull – besonders sinnvoll bei projektspezifischen Skills. Freelancer fahren dagegen besser mit einem schlanken, persönlichen Stack und ergänzen Skills nur dann, wenn sich wiederkehrende Bedürfnisse zeigen.

Skill-Konflikte und Prompt-Überladung vermeiden

Wenn zwei Skills denselben Bereich abdecken, kann Claude widersprüchliche Anweisungen erhalten und dadurch uneinheitliche Ergebnisse liefern. Die Lösung heißt Disziplin: Halte die Zahl deiner aktiven Skills überschaubar und setze auf Qualität statt Quantität. Viele erfahrene Nutzer reduzieren bewusst und aktivieren nur die Skills, die für ein bestimmtes Projekt tatsächlich gebraucht werden – der Rest bleibt deaktiviert.

7. Barrierefreiheits-Skills für Designer bei Claude

Warum Barrierefreiheit einen eigenen Abschnitt verdient

Barrierefreiheit ist längst keine Kür mehr. Mit dem ADA, der europäischen EN 301 549 und den WCAG 2.2 gibt es für professionelle Design-Arbeit inzwischen einen klaren Compliance-Standard. KI-gestützte Barrierefreiheitsprüfung ist deshalb so wertvoll, weil sie Probleme schon in der Design-Phase aufdeckt – dort, wo Korrekturen noch günstig sind – und nicht erst spät in der Entwicklung oder nach dem Launch, wenn es teuer und aufwendig wird.

AccessLint Claude: Alle Funktionen im Detail

AccessLint Claude ordnet Probleme den WCAG-Konformitätsstufen A, AA und AAA zu, sodass du sofort weißt, welche Fehler rechtlich zwingend behoben werden müssen und welche nur Best-Practice-Verbesserungen sind. Die Ausgabe ist übersichtlich und direkt umsetzbar: Sie benennt das Problem, erklärt es und schlägt dann die Lösung vor. Für Design-Engineers lässt sich das Tool in eine CI/CD-Pipeline einbinden, sodass Barrierefreiheits-Regressionen bei jedem Commit auffallen – statt erst bei einem vierteljährlichen Audit.

Skill für Farb- und Kontrastprüfung

Dieser Skill prüft Kontrastverhältnisse in Echtzeit gegen die WCAG-Grenzwerte und schlägt – noch praktischer – barrierefreie Farbalternativen vor, wenn eine Kombination durchfällt. Damit wird aus einem blockierenden Fehler eine Design-Entscheidung, die du in Sekunden lösen kannst, statt eine langwierige Diskussion über die Markenfarben zu führen.

Aria- & Semantic-HTML-Berater

Dieser Berater erkennt fehlende Landmark-Rollen und falsche Heading-Hierarchien – die zwei häufigsten strukturellen Barrierefreiheitsfehler. Kombiniere ihn mit Frontend Design AI, damit deine generierten Komponenten schon im ersten Entwurf semantisch korrektes Markup liefern, statt später eine aufwendige semantische Nachbearbeitung zu brauchen.

8. Claude Skills im Vergleich: Wann nutzt man was?

Claude Skills vs. MCP (Model Context Protocol)

Die beiden ergänzen sich, statt in Konkurrenz zu stehen. MCP liefert Echtzeit-Verbindungen und zieht sich genau dann den aktuellen Figma-Stand oder ein GitHub-Repository, wenn du es brauchst. Skills wiederum liefern wiederverwendbare Anweisungen und Persona-Sets, die festlegen, wie Claude sich verhält. Nutze MCP für Live-Kontext und Skills für konsistentes Verhalten – und kombiniere beides, wenn du ein Power-User bist. Wie es eine Zusammenfassung treffend formuliert: Skills enthalten das Vorgehen, Tools führen die Aktionen aus, und MCP stellt den Zugang bereit.

Claude Skills vs. spezialisierte Design-KI-Tools

Im Vergleich zu spezialisierten Tools wie Galileo AI, Uizard und Locofy punkten Claude Skills mit Flexibilität, Tiefe bei individuellen Anweisungen und ihrer Argumentationsfähigkeit. Du kannst deine genauen Konventionen hinterlegen, und Claude wendet sie zuverlässig an. Spezialisierte Tools wiederum überzeugen mit einer ausgefeilten Benutzeroberfläche und sofort einsetzbarer visueller Generierung – sie zeigen dir Pixel, nicht nur Code. Ehrlich gesagt erfüllen beide unterschiedliche Aufgaben, und viele Designer nutzen deshalb beides parallel.

Claude Skills vs. manuelle Prompt-Bibliotheken

Skills sind versionskontrolliert, teilbar und dauerhaft aktiv. Manuelle Prompt-Bibliotheken hängen dagegen von der Disziplin beim Kopieren und Einfügen ab und brechen zusammen, sobald jemand die falsche Zeile ändert. Wenn du bereits ausgereifte Prompt-Vorlagen hast, die gut funktionieren, lohnt es sich, sie in individuelle Skills zu überführen. Der entscheidende Unterschied liegt in der Beständigkeit: Jede Skill ist eine SKILL.md-Datei, die Claude nur lädt, wenn sie zu deiner Anfrage passt.

9. Sicherheit & Prüfung von Claude Skills von Drittanbietern

Skill-Berechtigungen verstehen

Skills arbeiten innerhalb klar definierter Grenzen. Laut Anthropic werden Skills durch ein Schema definiert, das ihre Eingaben, Ausgaben und Berechtigungen beschreibt. Prüfe daher immer, ob ein Skill nur lesenden oder auch schreibenden Zugriff hat, bevor du ihn installierst – und denk daran, dass manche Skills externe Tools aufrufen, Dateien in deinem Projekt lesen oder Code generieren können, den du dann ausführst.

Warnsignale bei der Bewertung von Drittanbieter-Skills

Finger weg von Skills, die für eine simple Aufgabe unverhältnismäßig weitreichende Berechtigungen verlangen, keinen einsehbaren Quellcode mitliefern oder von einem unbekannten Anbieter ohne jegliche Community-Bewertungen stammen. Als sichere Faustregel gilt: Bevorzuge offizielle Marketplaces, und behandle Community-Marketplaces so, wie du Open-Source-Code behandeln würdest – mit gesunder Skepsis.

Best Practices für Design-Teams

Führe eine Liste freigegebener Skills, prüfe jeden Skill, bevor er in einen gemeinsamen Workspace gelangt, und kontrolliere installierte Skills regelmäßig, um solche zu entfernen, die niemand mehr nutzt. Wenn du im beruflichen Kontext installierst, halte dich an die üblichen Sicherheitsrichtlinien deines Unternehmens. Ein schlanker, gut geprüfter Skill-Stack ist sicherer und leistungsfähiger als ein ausufernder.

10. Einen eigenen Claude Skill für Design erstellen

Wann sich Eigenbau statt Kauf lohnt

Baue dir deinen eigenen Skill, wenn dein Designsystem zu speziell für fertige Skills ist oder wenn vorhandene Skills nicht zu den Namens- und Strukturkonventionen deiner Komponentenbibliothek passen. Wenn du mehr Zeit damit verbringst, einen generischen Skill zu korrigieren, als er dir spart, ist das dein Signal, selbst Hand anzulegen.

Der Aufbau eines Claude Skills

Die Mechanik dahinter ist erfreulich simpel. Ein Skill ist im Grunde ein Ordner. Darin liegt eine Datei namens SKILL.md, geschrieben in ganz normalem Markdown, die Claude erklärt, wie eine bestimmte Aufgabe zu erledigen ist. Der Ordner kann außerdem Skripte, Vorlagen und Referenzdateien enthalten, die für die Aufgabe gebraucht werden. Ein gut aufgebauter Skill enthält einen System-Prompt-Block, der Persona, Umfang und Einschränkungen definiert, ein paar Beispiel-Interaktionen (Few-Shot-Beispiele), eine Vorgabe zum Ausgabeformat wie JSON, Markdown oder einen Codeblock, sowie Metadaten zu Name, Beschreibung, Kategorie und Berechtigungen.

Schritt für Schritt: Einen Skill für dein Designsystem bauen

1. Dokumentiere deine Tokens und Regeln. Halte deine Farb-, Abstands- und Typografie-Skalen sowie Komponentenkonventionen schriftlich fest. Das wird deine Referenzebene.
2. Schreib den System-Prompt. Sei konkret bei Markenstimme, Barrierefreiheitsstandards und Namenskonventionen. Vage Anweisungen führen zu vagen Ergebnissen.
3. Füge 3 bis 5 Beispiel-Frage-Antwort-Paare hinzu. Deck dabei die Grenzfälle ab, an denen Claude oft scheitert, nicht nur die Standardsituationen.
4. Teste mit echten Briefings und verbessere laufend. Orientiere dich an dem Qualitätsniveau, das Anthropic empfiehlt: Nutzer müssen Claude während des Workflows nicht nachsteuern, die Ausgaben sind bei wiederholten Durchläufen strukturell konsistent, und ein neuer Nutzer kann die Aufgabe schon beim ersten Versuch ohne Anleitung lösen.
5. Veröffentliche den Skill in deinem Team-Workspace oder im Marketplace. Versioniere ihn, damit Updates sauber übernommen werden.

Eine Sache solltest du dir beim Entwickeln unbedingt merken: Genau hier scheitern die meisten Skills lautlos, denn die Regeln sind streng – und Claude lädt einen Skill schlicht nicht, wenn er dagegen verstößt, ohne dass eine Fehlermeldung erklärt, warum.

Tools, die die Erstellung eigener Skills beschleunigen

Nutze Anthropics Scaffolding-Vorlagen aus der offiziellen Dokumentation als Ausgangsstruktur und teste mit der Claude Code CLI, bevor du veröffentlichst – so fallen dir Ladefehler schon lokal auf. Einen guten Skill zu bauen, ist im Grunde wie das Einarbeiten einer neuen Kollegin oder eines neuen Kollegen. Anthropic vergleicht es damit, einen Onboarding-Guide für eine neue Person im Team zu schreiben: Du hältst den Ablauf einmal schriftlich fest, und der Agent folgt ihm.

11. Empfehlenswerter Einstiegs-Stack: Die besten Claude Skills für Designer (anfängerfreundlich)

Die essenziellen Drei (diese zuerst installieren)

1. Frontend Design AI verwandelt Briefings sofort in Code und deckt die häufigste Aufgabe überhaupt ab.
2. AccessLint Claude integriert Barrierefreiheit von Anfang an, bevor eine nachträgliche Anpassung teuer wird.
3. Figma Claude Integration schließt die Lücke zwischen Designdateien und Entwickler-Übergabe.

Diese drei decken Generierung, Compliance und Übergabe ab – also den Großteil der wiederkehrenden Arbeit eines Designers.

Diese kommen hinzu, sobald du wächst

Füge UI/UX Pro hinzu, sobald du regelmäßig Kritiken oder Kundenreviews durchführst. Füge Design Token Manager hinzu, sobald dein Designsystem soweit formalisiert ist, dass es eine einheitliche Quelle der Wahrheit gibt. Füge Component Doc Generator hinzu, sobald du so häufig an Entwickler übergibst, dass fehlende Dokumentation zu echten Kosten wird.

Skills, die man am Anfang vermeiden sollte

Vermeide sich überschneidende Skills, die widersprüchliche Anweisungen erzeugen, und meide Beta- oder experimentelle Skills ohne Community-Erfahrungswerte. Am Anfang schlägt Stabilität Neuheit – immer.

Um Claude Skills zu testen, brauchst du ein Pro- oder Max-Abo, monatlich in USD abgerechnet. Eine typische Kreditkarte berechnet dabei 2 bis 3% Auslandseinsatzentgelt bei jeder Abbuchung. Bleap verlangt 0% FX-Gebühren und gibt dir pauschal 20% Cashback auf Claude, ChatGPT und Gemini. Hol dir die Bleap-Karte →

Häufig gestellte Fragen (FAQ)

Was ist der Claude Skills Marketplace und wo finde ich ihn?

Im Marketplace werden offizielle und von der Community erstellte Skills zur Installation angeboten. In der Web-App findest du ihn im Bereich „Marketplace“, und in Claude Code fügst du Marketplaces direkt über das Terminal hinzu und durchsuchst sie dort. Von Anthropic gepflegte Skills, etwa für erweiterte Dokumentenerstellung, stehen allen Nutzern zur Verfügung und werden von Claude automatisch aufgerufen, wenn sie relevant sind. Filtere nach Design- und Kreativ-Kategorien und achte bevorzugt auf verifizierte, kürzlich aktualisierte Skills.

Wie unterscheiden sich Claude Skills von Claude MCP-Plugins?

Skills sind wiederverwendbare Anweisungssätze, die festlegen, wie Claude eine Aufgabe ausführt; MCP-Connectors ermöglichen dagegen den Echtzeitzugriff auf externe Daten und Systeme. Die klare Trennung lautet: Skills enthalten das Vorgehen, Tools führen die Aktionen aus, MCP stellt den Zugriff bereit. Nutze MCP, wenn du Live-Kontext brauchst, etwa den aktuellen Figma-Status, und Skills, wenn du ein konsistentes, wiederholbares Verhalten möchtest.

Frage 3: Kann ich Claude Skills direkt mit Figma nutzen?

Ja, über den Figma Claude Integration Skill, der wie ein API-Handshake funktioniert und nicht als natives Canvas-Plugin. Er übernimmt die Spec-Extraktion, das Abrufen von Tokens und das Verfassen von Kommentaren und funktioniert am besten mit aktiviertem Figma Dev Mode. Die zu erwartende Einschränkung: Er liest und schreibt Figma-Daten, läuft aber nicht visuell innerhalb des Figma-Editors.

Gibt es Claude Skills speziell für UI/UX-Design und Barrierefreiheit?

Ja. UI/UX Pro übernimmt Wireframe-Kritik und heuristische Bewertungen, während AccessLint Claude und der Color & Contrast Checker sich um Barrierefreiheit kümmern. AccessLint ordnet Probleme den WCAG-Stufen A, AA und AAA zu und liefert jeweils Problem, Erklärung und Lösungsvorschlag. Für Teams, die ADA- oder EN-301-549-Vorgaben erfüllen müssen, gehören diese zu den wertvollsten Skills, die man früh installieren sollte.

Wie installiere ich einen Claude Skill über die Claude Code CLI?

Erst einen Marketplace hinzufügen, dann davon installieren. Füge einen GitHub-Marketplace mit /plugin marketplace add owner/repo hinzu und installiere anschließend einen Skill mit /plugin install skill-name@marketplace-name. Skills werden beim Start geladen, also starte Claude Code neu und überprüfe das Ganze mit dem doctor-Befehl. Die komplette Anleitung findest du in Abschnitt 4.2.

Ist es sicher, Skills von Drittanbietern für meinen Design-Workflow zu installieren?

Das kann sein – vorausgesetzt, du prüfst sie vorher genau. Skills werden über ein Schema definiert, das ihre Eingaben, Ausgaben und Berechtigungen beschreibt. Schau dir also unbedingt den Umfang an, bevor du installierst. Achte auf zu weitreichende Berechtigungen, fehlenden Quellcode und unbekannte Anbieter. Halte dich an die Faustregel, offizielle Marketplaces zu bevorzugen und Community-Marketplaces wie Open-Source-Code zu behandeln – also mit entsprechender Vorsicht. Teams sollten außerdem eine Allowlist pflegen und regelmäßig Audits durchführen, wie in Abschnitt 9 beschrieben.

Fazit: Der beste Claude-Skills-Stack für Design

Claude Skills sind der effizienteste Weg, Claude für wiederkehrende Design-Aufgaben zu erweitern – gerade weil sie dauerhaft bestehen bleiben, sich sauber teilen lassen und nur bei Bedarf geladen werden. Für die meisten Designer bilden Frontend Design AI, AccessLint Claude und die Figma-Integration den unverzichtbaren Kern, der Generierung, Barrierefreiheit und Übergabe abdeckt. Gliedere deinen Stack in Referenz-, Funktions- und Connector-Skills, damit er auch mit wachsender Zahl übersichtlich bleibt. Starte mit den "Essential Three" und ergänze Spezial-Skills erst, wenn ein wiederkehrender Bedarf auftaucht. Das Ökosystem entwickelt sich rasant, also speichere den Marketplace als Lesezeichen und schau alle drei Monate wieder vorbei.

Noch ein praktischer Hinweis zu den Kosten: Diese Skills laufen über ein Claude-Abo, das monatlich in USD abgerechnet wird – und die meisten Karten berechnen bei jeder Verlängerung stillschweigend 2 bis 3% Auslandseinsatzgebühr. Egal welche Skills du nutzt, zahl schlau: Mit Bleap sparst du dir die Fremdwährungsgebühren auf USD-Abos, und bei Claude, ChatGPT und Gemini bekommst du bei jeder Verlängerung 20% Cashback – alles über eine selbstverwahrte Mastercard ganz ohne eigene Abogebühr.