Fähigkeiten design-taste-frontend
📦
design-taste-frontend
Inhaltsrevision r1 Sicher ⚙️ Externe Befehle🌐 Netzwerkzugriff
Ausgereifte Frontend-Oberflächen erstellen
KI-generierte Oberflächen wirken oft generisch oder übersehen produktionsrelevante Details. Dieser Skill gibt Claude, Codex und Claude Code strikte Design- und Frontend-Leitplanken.
Unterstützt: Claude Codex Code(CC)
Mit meinem Agent installieren
Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.
Agent-Anfrage
Review the Skillstore skill "design-taste-frontend" from https://skillstore.io/skills/leonxlnx-design-taste-frontend.md and its manifest at https://skillstore.io/api/skills/leonxlnx-design-taste-frontend/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.
Agent-lesbare Ressourcen
Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.
Testen
„design-taste-frontend“ wird verwendet. Improve a SaaS billing page that feels flat and generic.
Erwartetes Ergebnis:
- Eine klarere Informationshierarchie mit zurückhaltender Farbe und prägnanterer Typografie.
- Responsive Abschnitte, die generische Reihen gleichartiger Cards vermeiden.
- Lade-, Leer-, Fehler- und aktive Zustände für Abrechnungsaktionen.
„design-taste-frontend“ wird verwendet. Create a product analytics dashboard with motion.
Erwartetes Ergebnis:
- Ein dichtes Dashboard-Layout, das Linien und Abstände statt übermäßiger Cards verwendet.
- Motion-Anleitung, die transform und opacity für flüssigere Performance verwendet.
- Eine Prüfcheckliste für mobile Reduktion, Abhängigkeitsnutzung und Animationsisolierung.
Sicherheitsaudit
Sicherv4 • 6.7.2026 Versionsbericht öffnen
All static findings were reviewed against SKILL.md. The backtick, URL, and reconnaissance hits are Markdown prose or frontend guidance, not executable behavior. No prompt injection, exfiltration intent, or unsafe automation evidence was found.
1
Gescannte Dateien
227
Analysierte Zeilen
0
Prüfelemente
0
Falschmeldungen ignoriert
Risikofaktoren
⚙️ Externe Befehle (54)
SKILL.md:18 SKILL.md:19 SKILL.md:20 SKILL.md:21 SKILL.md:22 SKILL.md:24 SKILL.md:25 SKILL.md:28 SKILL.md:29 SKILL.md:30 SKILL.md:31 SKILL.md:32 SKILL.md:39 SKILL.md:40 SKILL.md:41 SKILL.md:42 SKILL.md:50 SKILL.md:53 SKILL.md:61 SKILL.md:64 SKILL.md:68 SKILL.md:69 SKILL.md:70 SKILL.md:71 SKILL.md:72 SKILL.md:75 SKILL.md:76 SKILL.md:77 SKILL.md:82 SKILL.md:83 SKILL.md:84 SKILL.md:85 SKILL.md:88 SKILL.md:89 SKILL.md:90 SKILL.md:95 SKILL.md:101 SKILL.md:102 SKILL.md:108 SKILL.md:119 SKILL.md:124 SKILL.md:125 SKILL.md:197 SKILL.md:198 SKILL.md:199 SKILL.md:201 SKILL.md:205 SKILL.md:206 SKILL.md:208 SKILL.md:212 SKILL.md:215 SKILL.md:221 SKILL.md:222 SKILL.md:223
🌐 Netzwerkzugriff (1)
Das letzte abgeschlossene statische und semantische Audit erkannte keine bestätigten Sicherheitsbefunde. Dies beweist nicht, dass der Skill keine Nebenwirkungen hat.
Geprüft von: codex Audit-Verlauf anzeigen →
Diesen Bericht teilen & zitieren
Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.
Berichtslink kopieren
https://skillstore.io/skills/leonxlnx-design-taste-frontend/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown-Badge
[](https://skillstore.io/skills/leonxlnx-design-taste-frontend?utm_source=security_passport_badge)HTML-Badge
<a href="https://skillstore.io/skills/leonxlnx-design-taste-frontend?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/leonxlnx-design-taste-frontend/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Einbettungskarte
<iframe src="https://skillstore.io/embed/skills/leonxlnx-design-taste-frontend.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Wissenschaftliche Zitate (APA · BibTeX · CFF)
APA-Zitat
leonxlnx. (2026). design-taste-frontend security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/leonxlnx-design-taste-frontend/audits/4BibTeX-Zitat
@techreport{leonxlnx-leonxlnx-design-taste-frontend-2026,
author = {leonxlnx},
title = {design-taste-frontend security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/leonxlnx-design-taste-frontend/audits/4},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "design-taste-frontend security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "leonxlnx"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/leonxlnx-design-taste-frontend/audits/4"
identifiers:
- type: other
value: "skillstore:leonxlnx-design-taste-frontend:audit:4"
description: "Skillstore immutable audit report identifier"
Skillstore-Score
Warum dieser Score Evidenzvertrauen: Hoch 55
Architektur
85
Wartbarkeit
87
Inhalt
69
Gemeinschaft
83
Spezifikationskonformität
Was Sie erstellen können
React-Screens verfeinern
Verbessert einen groben React- oder Next.js-Screen mit klarerer Hierarchie, responsiven Layouts und vollständigen UI-Zuständen.
Visuelle Leitplanken setzen
Wendet strikte Regeln für Typografie, Farbe, Abstände und Motion an, bevor ein Agent Interface-Code schreibt.
Bessere Prototypen ausliefern
Verwandelt eine Produktidee mit praktischen Designbeschränkungen und Performance-Prüfungen in einen ausgereiften Prototyp.
Diese Prompts ausprobieren
Einen einzelnen Screen verbessern
Use design-taste-frontend to improve this screen. Preserve the current stack. Focus on spacing, typography, color restraint, and mobile behavior.
Eine Dashboard-UI generieren
Create a React dashboard for [product]. Use dense data layout rules, complete loading and empty states, and no generic card grid.
Motion sicher hinzufügen
Add motion to this interface. Keep animations isolated in client components. Use transform and opacity only. Include cleanup for any effects.
Einen vollständigen Flow prüfen
Review this multi-page frontend flow. Identify weak visual hierarchy, missing states, risky motion, and responsive issues before editing code.
Bewährte Praktiken
- Teilen Sie Produktkontext, Zielbenutzer und bestehende Markenbeschränkungen mit, bevor Sie um Implementierung bitten.
- Bitten Sie den Agenten, package.json zu prüfen, bevor er eine Drittanbieter-UI- oder Motion-Bibliothek hinzufügt.
- Prüfen Sie mobile Layouts und Motion-Performance nach jeder generierten Frontend-Änderung.
Vermeiden
- Verwenden Sie den Skill nicht, um ein bestehendes Designsystem ohne Freigabe zu überschreiben.
- Fordern Sie keine schwere dauerhafte Animation für datenintensive oder stromsparende mobile Workflows an.
- Akzeptieren Sie keine neuen Abhängigkeiten, sofern das Projekt sie nicht unterstützt oder das Team die Installation nicht freigibt.
Häufig gestellte Fragen
Schreibt dieser Skill Frontend-Code?
Er leitet einen KI-Agenten an, während dieser Frontend-Code schreibt oder überprüft. Er liefert keine Komponenten von sich aus aus.
Auf welche Stacks zielt er ab?
Er bevorzugt React, Next.js, Tailwind CSS und gängige Motion-Bibliotheken. Der Benutzer kann einen anderen Stack anfordern.
Kann er mit Claude, Codex und Claude Code funktionieren?
Ja. Der Inhalt ist anweisungsbasiert und nennt Unterstützung für Claude, Codex und Claude Code.
Benötigt er Netzwerkzugriff?
Nein. Der Skill ist eine Markdown-Anweisungsdatei. Er kann Platzhalter-Bild-URLs als Beispiele referenzieren.
Installiert er Abhängigkeiten automatisch?
Nein. Er weist den Agenten an, package.json zu prüfen und Installationsbefehle anzuzeigen, wenn ein Paket fehlt.
Ist er sicher für Produktionsprojekte?
Er eignet sich als Orientierung, aber generierter Code benötigt weiterhin normale Reviews, Tests und Barrierefreiheitsprüfungen.