Star200+

Frontend Design

Stark · 81
Im Registry indexiert

Guidance for distinctive, intentional UI design, typography, visual direction, and non-template-like product interfaces.

Verified installs2
Stars170.9K
Version1.0.0
Qualität100/100 · Ausgezeichnet
Vertrauen81/100 · Vor Installation prüfen
Audit94/100 · Sicher zu testen

Asset-Profil

Design und kreative Produktion

Design assets, images, video, audio, multimodal media, presentation, and creative production skills.

Bereich ansehen

Szenario

Design und Kreativität

I need my agent to produce design assets, UI directions, presentations, or creative media workflows.

Agent-Fit

Claude Code + OpenAI Agents + Cursor

Geeignet für Codex, Claude Code, Cursor, CLI oder benutzerdefinierte Agents.

Installieren

Bereit

npx skills add anthropics/skills --skill frontend-design

Wartung

Aktuell

Heute gepusht

Risiko

Sicher zu testen

Use is subject to the upstream source terms; review LICENSE.txt before redistribution.

GitHub-Qualität

171K

100/100 Qualität · 94/100 Vertrauen

Abdeckungs-Tags

DesignDesign und KreativitätDesign und Kreativitätagent-skillfrontend-design

Review-Notizen

Use is subject to the upstream source terms; review LICENSE.txt before redistribution.

Agent-Adoptionskarte

Vertrauen, Audit und Installationsbereitschaft auf einen Blick

Diese Werte kombinieren öffentliche Repository-Metadaten, OpenAgentSkill-Reviewsignale, Wartungsaktualität und Installationsbereitschaft. Sie helfen bei der Vorauswahl, ersetzen aber keine menschliche Prüfung.

Qualität

Ausgezeichnet
100

High-confidence pick with strong adoption and healthy maintenance signals.

Vertrauen

Vor Installation prüfen
81

Gutes Shortlist-Signal, aber der Agent sollte Auditnotizen, Installationsrichtlinien und Ergebnisbelege vor der Ausführung prüfen.

Audit

Sicher zu testen
94

Maschinenlesbare Prüfung von Installationsbereitschaft, Sicherheitsmetadaten, Wartung und Akzeptanzrisiko.

OpenAgentSkill Trust Score v5

Agent-Installationskandidat

Nach menschlicher oder Sandbox-Prüfung als primären Kandidaten verwenden.

Claude CodeCodexCursorOpenAgentSkill CLI

Stars

171K GitHub-Stars

Repository-Aktivität

171K Stars und 20K Forks

Wartung

Heute gepusht

Lizenz

Source terms (see LICENSE.txt)

Installieren

npx skills add anthropics/skills --skill frontend-design

Installationssicherheit

Standard-Paket- oder Laufzeit-Installationspfad

Berechtigungsfläche

Keine Hochrisiko-Berechtigungsfläche in öffentlichen Metadaten

Agent-Ergebnisse

Early agent signal: 100% success from 2 agent outcomes

Dokumentation

Starker README/SKILL.md-Kontext

Risikoübersicht

Vor Produktion prüfen

  • Use is subject to the upstream source terms; review LICENSE.txt before redistribution.
  • Agent Proven outcomes: Early agent signal: 100% success from 2 agent outcomes

Installationsbereitschaft

Installationspfad verfügbar

  • Installationspfad ist verfügbar
  • Repository-Belege sind verfügbar
  • Lizenz ist angegeben
  • Early agent signal (51/100 Agent Proven)

Agent-lesbare Metadaten

Maschinenlesbare Entscheidungsdaten für diesen Skill.

Nutze diesen Block oder das eingebettete JSON, um zu entscheiden, ob ein Agent diesen Skill installieren, eine Alternative wählen oder zuerst menschliche Prüfung anfordern soll.

JSON öffnen

Geeignete Aufgaben

  • Design und Kreativität-Workflows
  • Claude-Code-Teams
  • Teams, die GitHub-Adoptionssignale schätzen
  • Inspect visual requirements

Geeignete Agents

Claude CodeCodexCursorOpenAgentSkill CLIOpenAI AgentsCLI

Installationsentscheidung

Befehl
npx skills add anthropics/skills --skill frontend-design
Richtlinie
Prüfen
Menschliche Prüfung
Ja

Vertrauen und Risiko

Vertrauen
81/100
Audit
94/100
Risikoebene
Sicher zu testen

Ergebnis-Loop

Endpoint
/api/agent/outcome
Event-ID
resolve
Ergebnisse
5

Installationsbefehl

npx skills add anthropics/skills --skill frontend-design
Öffentliches AuditEval-BerichtResolve APIInstallationsübergabe

Nicht verwenden, wenn

  • Teams, die ein vom Anbieter unterstütztes SLA benötigen
  • production agents without a repository review
  • Use is subject to the upstream source terms; review LICENSE.txt before redistribution.
  • Agent Proven outcomes: Early agent signal: 100% success from 2 agent outcomes
  • Production credentials, payments, or irreversible account changes without explicit human review

Alternative

Taste Skill: Anti-Slop Frontend

79.0K Stars

npx skills add Leonxlnx/taste-skill --skill design-taste-frontend

Alternative

Canvas Design

170.9K Stars

npx skills add anthropics/skills --skill canvas-design

Alternative

Anthropic Brand Guidelines

170.9K Stars

npx skills add anthropics/skills --skill brand-guidelines

Alternative

Animation Vocabulary

16.5K Stars

npx skills@latest add emilkowalski/skills

Agent-Sicherheit v2

82/100 · Vor Installation prüfen

GeprüftPrüfen

Gute Audit- und Sicherheitssignale ohne Hochrisiko-Berechtigungshinweise in öffentlichen Metadaten.

Prüfen Sie die Audit-Seite und erlauben Sie die Agent-Installation dann in einem Sandbox-Workflow.

Per API auflösen

Mittel

Netzwerkzugriff

Die Skill ruft wahrscheinlich Remote-Seiten, APIs, Repositories oder externe Dienste ab.

  • Use is subject to the upstream source terms; review LICENSE.txt before redistribution.

Installationsziele

Diesen Skill im Agent-Workflow installieren

Über den öffentlichen Endpunkt erhältst du Befehl, Sicherheitscheckliste, Ziel-Prompts und kanonische Links.

skill install

OpenAgentSkill CLI

Resolve policy, run the source installer safely, and report a verified install receipt.

$ npx --yes https://github.com/Leon-Drq/openagentskill/releases/download/cli-v0.2.1/openagentskill-0.2.1.tgz install anthropic-frontend-design

Agent-Auflösungsplan

Lass einen Agent die Eignung vor der Installation prüfen.

Die Resolve API liefert die beste Skill, Alternativen, Sicherheitsrichtlinien, Auditnotizen, Installationsziel und einen direkt nutzbaren Prompt.

Textplan öffnen

JSON öffnen

/api/agent/resolve?task=Use%20Frontend%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium

Resolve-Text

/api/agent/resolve?task=Use%20Frontend%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium&format=text

Installationsübergabe

/api/skills/anthropic-frontend-design/install

Agent sollte prüfen

  • Task fit and alternatives from Resolve API.
  • Audit score, trust score, and safety policy warnings.
  • Install target compatibility for Codex, Claude Code, Cursor, or CLI.

Prompt kopieren

Task: Use Frontend Design in this workspace.
Resolve first: https://www.openagentskill.com/api/agent/resolve?task=Use%20Frontend%20Design%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Review install handoff: https://www.openagentskill.com/api/skills/anthropic-frontend-design/install
Install command: npx skills add anthropics/skills --skill frontend-design
Before running it, summarize audit warnings, required permissions, and the fallback skill if install is risky.

Agent-Übergabe

Gib dem Agent den Installationspfad, nicht noch ein Verzeichnis.

Über den öffentlichen Endpunkt erhältst du Befehl, Sicherheitscheckliste, Ziel-Prompts und kanonische Links.

Installations-API öffnen

Installationsübergabe

/api/skills/anthropic-frontend-design/install

LLM-Textformat

/api/skills/anthropic-frontend-design/install?format=text

Alternativen finden

/api/skills/search?q=Frontend%20Design&limit=3

Agent-Prompt

Use Frontend Design for this task. Review https://www.openagentskill.com/api/skills/anthropic-frontend-design/install, then install with: npx skills add anthropics/skills --skill frontend-design

Registry-Metadaten

Agent-lesbares Profil für die automatische Skill-Auswahl.

Die Registry API stellt Entscheidungs-, Vertrauens-, Audit-, Use-Case- und Installationssignale ohne UI-Scraping bereit.

Manifest öffnen

Manifest

/api/registry/manifest/anthropic-frontend-design

LLM-Text

/api/registry/manifest/anthropic-frontend-design?format=text

Installationsalias

/api/registry/install/anthropic-frontend-design

Empfehlen

/api/registry/recommend?task=Use%20Frontend%20Design%20in%20an%20agent%20workflow&limit=3

Agent-Fit

100/100

Design und Kreativität

Use-Case-Tags

Design und KreativitätCoding-AgentsBrowser automation

Plattformen

Claude Code, Codex, Cursor, OpenAI Agents

Audit-Bericht

Sicher zu testen · 94/100

Maschinenlesbare Prüfung von Installationsbereitschaft, Sicherheitsmetadaten, Wartung und Akzeptanzrisiko.

Audit-Bericht ansehenEval-Bericht ansehen

Agent-Entscheidungspanel

Primäre Wahl für Design und Kreativität

Use this as a leading candidate, then validate the README and install path in your own agent stack.

100
Bereitschaft
Übernehmen
Phase

Rolle im Stack

Primäre Wahl

Primäre Eignung

Design und Kreativität

Vertrauenslabel

Produktionsbereit

Installationspfad

Befehl bereit

Verwenden wenn

  • Design und Kreativität-Workflows
  • Claude-Code-Teams
  • Teams, die GitHub-Adoptionssignale schätzen

Evidenz

  • 170,882 GitHub-Stars
  • recent repository activity
  • install command or GitHub repo available
  • Qualitätsprofil 100/100
  • 958 OpenAgentSkill-Interaktionen

zuerst prüfen

  • Use is subject to the upstream source terms; review LICENSE.txt before redistribution.

Implementierungspfad

  1. 1Installieren Sie es in einem Sandbox-Agent und führen Sie eine Design und Kreativität-Aufgabe vollständig aus.
  2. 2Compare output quality, latency, and failure behavior against at least one alternative.
  3. 3Promote it into production only after reviewing repository permissions, license, and maintenance signals.

Vertrauensprofil

Vor Installation prüfen

Gutes Shortlist-Signal, aber der Agent sollte Auditnotizen, Installationsrichtlinien und Ergebnisbelege vor der Ausführung prüfen.

81
OpenAgentSkill Trust Score

GitHub-Akzeptanz

Bestanden

171K GitHub-Stars

Star-/Fork-Aktivität

Bestanden

171K Stars und 20K Forks; Issue-Aktivität ist in den aktuellen Metadaten nicht verfügbar

Aktuelle Wartung

Bestanden

Heute gepusht

Lizenzklarheit

Bestanden

Source terms (see LICENSE.txt)

Positive Signale

  • Manuell verifizierte Auflistung
  • KI-Prüfung genehmigt
  • Installationspfad ist verfügbar
  • Repository-Belege sind verfügbar
  • Kürzlich gewartetes Repository
  • Large GitHub adoption signal
  • Der Installationsbefehl weist kein offensichtliches Hochrisikomuster auf
  • OpenAgentSkill-Nutzungsaktivität erkannt
  • Ergebniszuverlässigkeit 40% aus 2 Bericht(en)

Vor Installation prüfen

  • Use is subject to the upstream source terms; review LICENSE.txt before redistribution.
  • Agent Proven outcomes: Early agent signal: 100% success from 2 agent outcomes
  • Vor unbeaufsichtigter Installation ist menschliche Prüfung erforderlich

Empfohlene Aktion

Nach menschlicher oder Sandbox-Prüfung als primären Kandidaten verwenden.

Qualitätsprofil

Ausgezeichnet Kandidat für Agent-Workflows

High-confidence pick with strong adoption and healthy maintenance signals.

100
GitHub-Stars
171K
Aktualität
Heute
Installationsbereit
Ja
Lizenz
Source terms (see LICENSE.txt)
Vor Installation prüfen: Use is subject to the upstream source terms; review LICENSE.txt before redistribution.

Workflow-Eignung

Diese Skill in diesen Szenarien nutzen

Create assets

Design and creative

I need my agent to produce design assets, UI directions, presentations, or creative media workflows.

Build and ship code

Coding agents

I need a coding agent that can understand a repository, edit code, and review pull requests.

Operate web apps

Browser automation

I need my agent to control a browser, fill forms, and verify web app workflows.

Workflow-Eignung

Zum vollständigen Workflow hinzufügen

Design, build, test, and ship interfaces

Frontend and UI

A practical workflow for agents that turn product briefs or Figma designs into polished frontend code, review the result, test it in a browser, and prepare a safe deployment.

Inspect, patch, and verify code

Coding review agent

A workflow for software agents that inspect repositories, review pull requests, generate tests, and turn findings into shippable patches.

Turn skills into distribution

Content growth agent

A workflow for turning newly indexed skills into SEO briefs, social drafts, comparison pages, and reusable publishing workflows.

Alternativen-Shortlist

Vor Installation vergleichen

Similar skills that may fit this task.

Alle vergleichen

Taste Skill: Anti-Slop Frontend

Design and implementation guidance for distinctive landing pages, portfolios, product demos, and purposeful redesigns.

Übernehmen
Bereit100
Qualität100
Stars79.0K

Canvas Design

Create original visual art, posters, PNG assets, and PDF documents through a clear design philosophy.

Übernehmen
Bereit100
Qualität100
Stars170.9K

Anthropic Brand Guidelines

Apply Anthropic official brand colors, typography, and visual standards to appropriate Anthropic-related artifacts.

Übernehmen
Bereit100
Qualität100
Stars170.9K

Animation Vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

Übernehmen
Bereit100
Qualität100
Stars16.5K

Übersicht

A source-verified Anthropic skill for creating or reshaping interfaces with deliberate visual direction. Use it for new UI, visual redesigns, typography, composition, and product polish. Review the upstream source terms before redistributing or adopting it in production workflows.

Plattformkompatibilität

claude-codeFULL
codexFULL
cursorFULL

Technische Details

Version
1.0.0
Lizenz
Source terms (see LICENSE.txt)
Letzte Aktualisierung
22. Aug. 2026
Veröffentlicht
21. Juli 2026

Frameworks & Tools

Claude CodeCodexCursor

Entscheidungsübersicht

Primäre Wahl

100
Bereit
Übernehmen
Phase

170,882 GitHub-Stars

Audit

Installationsprüfung

Installations- und Adoptionsprüfung

94
Sicher zu testen
Sicherheit
84/100
Wartung
100/100
Installieren
92/100
Vollständiges Audit öffnenEval-Bericht ansehen

Von Agent belegte Evidenz

Von Agent belegte Evidenz

Ergebnisberichte nach Resolve, Prüfung, Installation und einem begrenzten Lauf.

51
Belegt
Early agent signalAuto-Installation: zuerst prüfenLetzter: 12. Aug. 2026
Erfolgsrate
100%
Letzter Fehler
0%
Ergebnisse
2
Ausgabequalität
—
Fehlgeschlagen
0
Nicht relevant
0
Installationen
2
Durch Risiko blockiert
0
Einrichtung erforderlich
0
Produktion
0

Early agent signal: 2 outcomes, 100% success, Agent Proven Score 51/100.

Agent-Proven-RankingErgebnisvertrag

Installieren

Zum Agent-Workflow hinzufügen

Kostenlos und Open Source. Bericht vor der Installation in Produktions-Agents prüfen.

Alternativen vergleichenAuto-AuflösungsplanAuf GitHub ansehenDokumentation

Wachstums-Loop

Share-Kit

X

Szenariobasierter Entwurf für Frontend Design, bereit für einen manuellen X-Post.

Kuratorenhinweis
Frontend Design: Guidance for distinctive, intentional UI design, typography, visual direction, and non-templa...

170.9K stars

https://www.openagentskill.com/skills/anthropic-frontend-design?ref=x
X-Entwurf öffnen
Optionale Antwort mit Installationsbefehl
Listing + install path for Frontend Design:
https://www.openagentskill.com/skills/anthropic-frontend-design?ref=x

Install: npx skills add anthropics/skills --skill frontend-design
Antwortentwurf öffnen

Quelle des Eintrags

Registry-indexiert

Beanspruchbar

Dieser Eintrag wurde aus öffentlichen Quellen indexiert und ist erst nach Genehmigung eines Maintainer-Anspruchs offiziell.

Ersteller
anthropics
Indexiert von
OpenAgentSkill Community-Index

Die Zuordnung verlinkt auf das öffentliche Repository oder Creator-Profil. Creator können den Eintrag beanspruchen, um Eigentümersignale zu aktualisieren.

Diesen Skill beanspruchen

Eigentümeranspruch

Diesen Skill-Eintrag beanspruchen

Dieser Registry-indexiert-Eintrag wird anthropics zugeschrieben, ist aber noch nicht offiziell markiert. Beanspruche ihn, um ein verifiziertes Eigentümersignal hinzuzufügen und künftige Launch-, Installations- und Audit-Updates vertrauenswürdiger zu machen.

Creator-Backlink-Kit

Evidenz-Badges in deine README einfügen

Zeige den kanonischen Eintrag, aktuelle Vertrauens- und Audit-Signale sowie echte Agent-Proven-Evidenz dort, wo Entwickler das Repository bewerten.

[![Listed on OpenAgentSkill](https://www.openagentskill.com/api/badge/anthropic-frontend-design?metric=listed&label=Listed)](https://www.openagentskill.com/skills/anthropic-frontend-design)
[![OpenAgentSkill Trust](https://www.openagentskill.com/api/badge/anthropic-frontend-design?metric=trust&label=Trust)](https://www.openagentskill.com/skills/anthropic-frontend-design)
[![OpenAgentSkill Audit](https://www.openagentskill.com/api/badge/anthropic-frontend-design?metric=audit&label=Audit)](https://www.openagentskill.com/skills/anthropic-frontend-design/audit)
[![Agent Proven](https://www.openagentskill.com/api/badge/anthropic-frontend-design?metric=proven&label=Agent%20Proven)](https://www.openagentskill.com/skills/anthropic-frontend-design)
Badge-Vorschau Audit öffnen Creator-Kit

Autor

A

anthropics✓

@anthropics

Tags

agent-skillfrontend-designuiuxtypographydesign-systemvisual-direction

Plattform-Fit

Claude CodeOpenAI AgentsCursor

Gesundheitssignale

GitHub-Stars
170.9K
Qualitätswert
84/100
Letzter GitHub-Push
21. Aug. 2026
Framework-Hinweise
3
OpenAgentSkill-Aufrufe
143
Installationskopien
28
Externe Klicks
7

Community-Signal

Teile mit, ob dieser Skill für deinen Agent-Workflow nützlich ist. Zusammengefasstes Feedback verbessert das Ranking im Laufe der Zeit.

Vertrauen & Sicherheit

Vor Installation prüfen

81
  • GitHub-Akzeptanz171K GitHub-StarsBestanden
  • Star-/Fork-Aktivität171K Stars und 20K Forks; Issue-Aktivität ist in den aktuellen Metadaten nicht verfügbarBestanden
  • Aktuelle WartungHeute gepushtBestanden
  • LizenzklarheitSource terms (see LICENSE.txt)Bestanden
  • README/SKILL.md-VollständigkeitMetadaten enthalten ausreichend Nutzungs- und Workflow-KontextBestanden
  • Abhängigkeits-/LaufzeitrisikoKeine wesentlichen Abhängigkeitsrisikohinweise in öffentlichen MetadatenBestanden

Ähnliche Skills

Taste Skill: Anti-Slop Frontend

Design and implementation guidance for distinctive landing pages, portfolios, product demos, and purposeful redesigns.

79.0K Stars

Canvas Design

Create original visual art, posters, PNG assets, and PDF documents through a clear design philosophy.

170.9K Stars

Anthropic Brand Guidelines

Apply Anthropic official brand colors, typography, and visual standards to appropriate Anthropic-related artifacts.

170.9K Stars

Animation Vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

16.5K Stars
InstallierenAuf GitHub ansehen