# Visual Design

> Apply visual design principles — typography, color, layout, imagery, and style — to create polished, coherent, and brand-aligned interfaces. Use when refining visual quality, establishing aesthetic direction, or ensuring brand consistency in product UI.

- Skill: `itsual/visual-design` (Agent Skill)
- Install (CLI): `npx skillmds@latest add itsual/visual-design`
- Raw SKILL.md: https://api.skillmd.com/api/skills/itsual/visual-design/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Design & Media
- Author: itsual (https://skillmd.com/u/itsual)
- Updated: 2026-09-21
- Page: https://skillmd.com/skills/itsual/visual-design

---


# Visual Design

## Overview

Visual design shapes how a product feels. It supports usability through hierarchy and clarity while expressing brand and emotional tone.

## When to Use

- Establishing or refining visual language
- Polishing UI from functional to production-ready
- Aligning product UI with brand guidelines
- Creating marketing-adjacent product surfaces

## Core Elements

- Typography scale and hierarchy
- Color system (including semantic and accessible use)
- Spacing, grid, and layout rhythm
- Iconography and imagery style
- Elevation, depth, and surfaces
- Brand expression within product constraints

## Principles

- Hierarchy first — beauty that confuses is failure
- Consistency builds trust and speed
- Accessibility is part of visual quality (contrast, type size)
- Restraint often reads as more premium than excess
- Design for real content density and languages

## Verification

- [ ] Visual hierarchy matches information priority
- [ ] Color and type meet accessibility baselines
- [ ] Style is coherent across key screens