web-design

Guide UI design decisions with principles for layout, typography, color, and spacing.

21|6|Updated Dec 10, 2025
One-click install
npx skills add https://github.com/mintuz/claude-plugins --skill web-design-mintuz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design
Source: https://github.com/mintuz/claude-plugins/tree/main/plugins/web/skills/web-design
Command: npx skills add https://github.com/mintuz/claude-plugins --skill web-design-mintuz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Clear, concise principles guide UI design decisions during layout, typography, color, and polish without prescribing code.

Core Features & Use Cases

  • Clear hierarchy and spacing guidelines to improve legibility across screens.
  • Typography and color principles to create intentional visuals and consistent components.
  • Use Case: Apply these principles to a landing page mockup to ensure a readable, accessible interface.

Quick Start

Apply these principles to your UI mockup to ensure clear hierarchy, balanced typography, and restrained color across components.

Frequently Asked Questions about web-design

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

FAQPage Schema
What UI design principles improve legibility across web and mobile interfaces?

UI design principles for legibility focus on establishing clear hierarchy, balanced typography, and restrained color usage to create readable, accessible interfaces across web and mobile screens.

How do I apply typography and spacing guidelines to a landing page mockup?

Apply typography and spacing guidelines during concepting and refinement to ensure clear visual hierarchy and balanced layout, resulting in a readable and intentional landing page interface.

Do I need specific design software to use these layout and color hierarchy principles?

No specific design software is required, as these layout and color hierarchy principles are code-agnostic and can be applied to any UI mockup or interface concept during the design process.

What is the best way to ensure visual hierarchy and intentionality in app interface design?

The best way to ensure visual hierarchy and intentionality in app interface design is to apply concise principles for spacing, typography, and color that guide decisions without prescribing code.

When should I use these UI design principles during the concepting and refinement stages?

Use these UI design principles during both concepting and refinement stages to establish intentional visuals early and polish clear hierarchy, legibility, and spacing across components before finalizing.

Why does my interface design lack consistent typography and clear hierarchy?

Your interface design lacks consistent typography and clear hierarchy when concise principles for spacing, color, and visual balance are not applied to guide component decisions across screens.