SkillHey.
Добавить навык

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".

Материал обновлён:

Открыть на GitHub
npx skills add mblode/agent-skills --skill ui-design
202Звёзды18ФоркиПоследний push репозитория

Об этом 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".

Почему мы его выбрали

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

Для каких задач подходит

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

Перед использованием

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

Источники и материалы

Ссылки на оригинальные материалы приведены ниже. Практические идеи предложены редакцией SkillHey.

Редакция SkillHey
reactui design

Похожие 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,1 тыс.Звёзды529Форки
Последний 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
2,7 тыс.Звёзды266Форки
Последний push репозитория
Бесплатно
Веб и интерфейсы

Anatomy

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

26,8 тыс.Звёзды2,3 тыс.Форки
Последний 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
57 тыс.Звёзды3,3 тыс.Форки
Последний push репозитория