Is this skill only for aesthetics?

No, it focuses on the science of visual perception and cognitive psychology to ensure designs are functional, clear, and easy for users to navigate.

What design masters does this skill draw from?

The skill incorporates systematic workflows and philosophies from design legends like Saul Bass and Dieter Rams to ensure professional-grade results.

How does this skill help with UI development?

It provides specific guidance on applying hierarchy, contrast, and spacing, including practical implementation examples for CSS frameworks like Tailwind.

Can this skill evaluate existing designs?

Yes, it can analyze code or design descriptions to check for balance, alignment, and WCAG accessibility standards such as color contrast ratios.

Visual Design Principles

Name: Visual Design Principles
Author: HermeticOrmus

byHermeticOrmus

Design Tools

Applies foundational visual laws and cognitive psychology to create professional, high-impact user interfaces and brand identities.

About

This skill equips Claude with a comprehensive framework of design fundamentals, moving beyond subjective aesthetics to evidence-based visual communication. It enables the AI to evaluate, debug, and implement designs based on core principles such as Gestalt psychology, visual hierarchy, the Golden Ratio, and accessibility-compliant contrast. Whether you are building a landing page from scratch or auditing an existing layout, this skill ensures every element serves a specific purpose and adheres to proven standards of balance, alignment, and unity, providing actionable implementation patterns for tools like Tailwind CSS.

Key Features

0 GitHub stars
Applies mathematical composition rules including the Rule of Thirds and the Golden Ratio for pleasing layouts.
Establishes clear visual hierarchy through strategic use of scale, weight, color, and position.
Implements Gestalt psychology principles like Proximity and Similarity for intuitive grouping.
Ensures accessibility compliance through rigorous contrast ratio testing and typographic standards.
Provides systematic spacing and alignment workflows optimized for modern frontend frameworks.

Use Cases

Generating professional UI designs that follow established visual communication laws.
Evaluating and debugging layout issues to improve user navigation and clarity.
Providing design rationales and teaching fundamentals during the development process.

About

Key Features

0 GitHub stars
Applies mathematical composition rules including the Rule of Thirds and the Golden Ratio for pleasing layouts.
Establishes clear visual hierarchy through strategic use of scale, weight, color, and position.
Implements Gestalt psychology principles like Proximity and Similarity for intuitive grouping.
Ensures accessibility compliance through rigorous contrast ratio testing and typographic standards.
Provides systematic spacing and alignment workflows optimized for modern frontend frameworks.

Use Cases

Generating professional UI designs that follow established visual communication laws.
Evaluating and debugging layout issues to improve user navigation and clarity.
Providing design rationales and teaching fundamentals during the development process.