design

Codify UI/UX design principles into reusable guidance for design teams.

7|Updated Apr 9, 2026
One-click install
npx skills add https://github.com/fatihkan/badi --skill design-fatihkan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/fatihkan/badi/tree/main/.claude/skills/design
Command: npx skills add https://github.com/fatihkan/badi --skill design-fatihkan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design decision fatigue and inconsistent interfaces slow product progress. This skill codifies UI/UX practices into accessible, reusable guidance for teams.

Core Features & Use Cases

  • UI/UX principles coverage: typography, color systems, layout, accessibility, and responsive design.
  • Design system creation and governance across products.
  • Prototyping and usability guidance to iterate on interfaces before development.

Quick Start

Draft a cohesive onboarding screen design spec that aligns with the system's typography, color, and accessibility standards.

Frequently Asked Questions about design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a cohesive UI design system for web and mobile interfaces?

Establish a UI design system by codifying typography, color systems, and accessibility standards into reusable guidance. This systematizes UI/UX principles across products to eliminate decision fatigue and ensure consistent mobile and web interfaces.

What is the best way to standardize typography and color systems across product teams?

Standardize typography and color systems by transforming UI/UX practices into accessible, reusable governance guidance. This mitigates design decision fatigue and prevents inconsistent interfaces, streamlining product progress across design teams.

How do I align an onboarding screen design spec with accessibility and UX principles?

Align an onboarding screen design spec by applying systematized typography, color, and accessibility standards. This ensures the interface meets UI/UX principles and adheres to established design system governance before entering development.

Can I use this design skill for prototyping and usability workflows?

Yes, you can use this skill for prototyping and usability workflows to iterate on interfaces before development. It provides actionable guidance to validate UI/UX principles and accessibility standards across web and mobile platforms.

Does this UI/UX design guidance require specific frameworks or dependencies?

No specific frameworks or dependencies are required. The UI/UX design guidance operates as runtime instructions loaded into context, needing only a YAML frontmatter with name and description in the SKILL.md file to activate.

Why does inconsistent interface design slow down product progress?

Inconsistent interface design slows product progress by causing design decision fatigue and lacking standardized UI/UX practices. Codifying typography, color theory, and accessibility into accessible guidance resolves this workflow bottleneck.