🎨

ui

Name: ui
Author: Chachamaru127

安全 🌐 网络访问⚙️ 外部命令

UI-Komponenten und Feedback-Formulare generieren

Schluss mit dem manuellen Programmieren von UI-Komponenten von Grund auf. Dieser Skill generiert barrierefreie, responsive UI-Komponenten und Feedback-Formulare mit shadcn/ui und modernen Best Practices.

支持: Claude Codex Code(CC)

📊 69 充足

下载技能 ZIP

在 Claude 中上传

前往设置 → 功能 → 技能 → 上传技能

开启并开始使用

测试它

正在使用“ui”。 Erstelle einen Hero-Bereich für meine Startup-Landing-Page

预期结果:

Generierte barrierefreie Hero-Komponente mit:
Semantische HTML-Struktur mit korrekter Überschriftenhierarchie
Hoher Kontrast mit WCAG 4.5:1-Verhältnis
Tastaturnavigierbarer CTA-Button mit Fokusstatus
Responsive Design für Mobilgeräte und Desktop
Alt-Text für alle eingebundenen Bilder
ARIA-Labels für Screenreader

正在使用“ui”。 Erstelle eine Preistabelle mit drei Stufen

预期结果:

Erstellte responsive Preiskomponente mit:
Drei Preisstufen mit klarem Feature-Vergleich
Umschalter für monatliche und jährliche Abrechnung
Hover-States und Fokusindikatoren
Mobilfreundliches gestapeltes Layout
Korrekte Überschriftenstruktur für Screenreader

正在使用“ui”。 Erstelle ein Feedback-Formular für Fehlerberichte

预期结果:

Implementiertes Feedback-Formular mit:
Kategorieauswahl-Dropdown mit Labels
Bewertungsskala mit barrierefreien Steuerelementen
Textfeld mit Validierung
Fehlermeldungen, die Screenreadern vorgelesen werden
Erfolgsbestätigung nach dem Absenden

安全审计

安全

v5 • 1/16/2026

This is a documentation-only skill providing UI generation guidance. All 24 static findings are false positives triggered by YAML front matter, Japanese Unicode text, SHA-256 hash strings, and markdown syntax. No executable code, network calls, or malicious patterns exist. Legitimate frontend development tool.

已扫描文件

365

分析行数

发现项

审计总数

风险因素

🌐 网络访问 (1)

skill-report.json:6

⚙️ 外部命令 (3)

SKILL.md:39-60 SKILL.md:60-64 SKILL.md:64-75

审计者: claude 查看审计历史 →

质量评分

架构

100

可维护性

内容

社区

100

安全

规范符合性

你能构建什么

Schnelles UI-Prototyping

Schnelles Generieren von Hero-Bereichen, Preistabellen und Feature-Karten für Landing Pages

Sammlung von Nutzer-Feedback

Implementierung von Fehlerberichten, Feature-Anfragen und Zufriedenheitsumfragen in Anwendungen

WCAG-konforme Komponenten

Sicherstellung, dass alle UI-Komponenten mit integrierten Checklisten die Standards für Barrierefreiheit erfüllen

试试这些提示

Hero-Bereich

Create a hero section with heading, subheading, and CTA button for a SaaS product using shadcn/ui

Preistabelle

Generate a responsive pricing table with 3 tiers and feature comparison using shadcn components

Feedback-Formular

Create a feedback form with rating, category selection, and text input for bug reports

Kontaktbereich

Build a contact form with validation, accessibility features, and proper labels

最佳实践

Immer Alt-Text für Bilder in Komponenten einfügen
Sicherstellen, dass Tastaturnavigation für alle interaktiven Elemente funktioniert
Semantisches HTML mit korrekter Überschriftenhierarchie verwenden