SkillHey.
Skill einreichen

UI Design

mblode/agent-skills

Designs and builds React/Next/Tailwind UI, audits visual and interaction defects, and stress-tests components with worst-case data. Use when asked to "build a landing page", "extract our design system", "add dark mode", "make this responsive", "remove UI slop", "audit this component", "stress-test this component", "break this UI", or "show me the worst case".

Inhalt aktualisiert:

Auf GitHub ansehen
npx skills add mblode/agent-skills --skill ui-design
202Sterne18ForksLetzter Repository-Push

Über diesen Skill

Designs and builds React/Next/Tailwind UI, audits visual and interaction defects, and stress-tests components with worst-case data. Use when asked to "build a landing page", "extract our design system", "add dark mode", "make this responsive", "remove UI slop", "audit this component", "stress-test this component", "break this UI", or "show me the worst case".

Warum wir es empfehlen

Summarized from the original mblode/agent-skills SKILL.md by mblode; the original upstream instructions were used.

Wobei es hilft

  • Use this workflow when the task matches the original UI Design instructions.

Vor der Nutzung

  • Read the original SKILL.md and referenced files in mblode/agent-skills.

Quellen und Referenzen

Die Originalquellen sind unten verlinkt. Praktische Einstiegsideen sind redaktionelle Vorschläge von SkillHey.

Redaktion: SkillHey
reactui design

Ähnliche Skills

Baseline UI

ibelick

Quickly deslop UI code by fixing spacing, hierarchy, typography, and small layout issues. Use when the interface needs a fast cleanup or polish pass.

  • ui design
  • frontend
11.066Sterne529Forks
Letzter Repository-Push

Refactoring UI Design System

wondelai

Audit and fix visual hierarchy, spacing, color, and depth in web UIs. Use when the user mentions "my UI looks off" (or amateur/unprofessional), "fix the design", "Tailwind styling", "color palette", "visual hierarchy", "design system", "spacing scale", or "component styling". Also trigger when building consistent design tokens, creating dark mode themes, improving data-visualization clarity, or polishing UI details before launch. Covers grayscale-first workflow, constrained design scales, shadows, and component styling. For typeface selection, see web-typography. For usability audits, see ux-heuristics.

  • ui design
  • frontend
2702Sterne266Forks
Letzter Repository-Push
Kostenlos
Web und UI

Anatomy

Turn technical concepts into interactive isometric machines: detailed SVG illustrations, WebGL effects and optional 3D motion, as HTML, SVG or React components.

26.848Sterne2255Forks
Letzter Repository-Push
wheresryan22

Prototyping Variants

Emil Kowalski

Build multiple genuinely different versions of a UI piece you describe, rendered behind a visual picker so you can flip through them live and promote the one that feels right. Only runs when explicitly invoked; it does not trigger on its own.

  • prototyping
  • ui design
56.965Sterne3336Forks
Letzter Repository-Push