·visual-design-foundations
*

visual-design-foundations

wshobson/agents

Apply typography, color theory, spacing systems, and iconography principles to create cohesive visual designs. Use when establishing design tokens, building style guides, or improving visual hierarchy and consistency.

2.2KInstalls·61Trend·@wshobson

Installation

$npx skills add https://github.com/wshobson/agents --skill visual-design-foundations

SKILL.md

Build cohesive, accessible visual systems using typography, color, spacing, and iconography fundamentals.

Line Height Guidelines: | Text Type | Line Height |

| Headings | 1.1 - 1.3 | | Body text | 1.5 - 1.7 | | UI labels | 1.2 - 1.4 |

Apply typography, color theory, spacing systems, and iconography principles to create cohesive visual designs. Use when establishing design tokens, building style guides, or improving visual hierarchy and consistency. Source: wshobson/agents.

View raw

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/wshobson/agents --skill visual-design-foundations
Category
*Creative Media
Verified
First Seen
2026-02-01
Updated
2026-02-18

Quick answers

What is visual-design-foundations?

Apply typography, color theory, spacing systems, and iconography principles to create cohesive visual designs. Use when establishing design tokens, building style guides, or improving visual hierarchy and consistency. Source: wshobson/agents.

How do I install visual-design-foundations?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/wshobson/agents --skill visual-design-foundations Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor

Where is the source repository?

https://github.com/wshobson/agents