---
title: "Visual Design Foundations - Air Market"
description: "Screens can end up looking assembled rather than designed, with mismatched type, colors and spacing. This covers the underlying principles - typography, color, spacing systems, iconography - and how…"
canonical: "https://airmarket.ai/app/visual-design-foundations"
---

[Air Market](/) / [Design](/category/design) / Visual Design Foundations

Skill by [Seth Hobson](/@wshobson)

# Visual Design Foundations

Interfaces that look like one person made them

## What this does

Screens can end up looking assembled rather than designed, with mismatched type, colors and spacing. This covers the underlying principles - typography, color, spacing systems, iconography - and how to turn them into tokens and a style guide. Reach for it when you are setting design foundations or cleaning up something inconsistent.

### Top 3 things it does for you

- Set up design tokens for type, color and spacing
- Write a style guide the team can follow
- Fix a screen where nothing draws the eye

## Information

**Visual Design Foundations at a glance**

|  |  |
| --- | --- |
| Kind | Skill |
| Publisher | [Seth Hobson](/@wshobson) |
| Category | [Design](/category/design) |
| Works with | Agent Skills - an open standard supported by 40+ agents |
| Size | 37 KB |
| Licence | MIT |
| Repository | [wshobson/agents](https://github.com/wshobson/agents/tree/ece811f23310a37ceb43496dbac0e244fe6845b6/plugins/ui-design/skills/visual-design-foundations) |
| GitHub stars | 39,077 (as of Nov 2026) |
| Installs | 14,175, counted by skills.sh (Nov 2026) |

## Security report

**Verified.** AIR scanned this exact version of Visual Design Foundations and recorded 0 findings and 2 flagged items. AIR's verdict: **safe**.

**What Visual Design Foundations's check was run against**

|  |  |
| --- | --- |
| Commit | ece811f23310a37ceb43496dbac0e244fe6845b6 |
| Content hash | bb6ef1b8b2e959348ad026248c0cec9a98be91a34650e1a959346cee0b66ef11 |
| Files read | [Browse the files at this exact commit](https://github.com/wshobson/agents/blob/ece811f23310a37ceb43496dbac0e244fe6845b6/plugins/ui-design/skills/visual-design-foundations/SKILL.md) |

A scan is named by the exact content it read, not by a version number. A different version is a different artifact, and nothing here applies to a version AIR has not scanned.

[Read the full security report for Visual Design Foundations](/security/visual-design-foundations)

## About Visual Design Foundations

Cohesive visual design rests on typography, color theory, spacing systems and iconography. This skill applies those principles rather than treating each screen as its own puzzle.

Use it when you are establishing design tokens, building a style guide, or improving visual hierarchy and consistency.

## What's inside

- SKILL.md - instructions
- references/color-systems.md - reference
- references/spacing-iconography.md - reference
- references/typography-systems.md - reference

## Questions

### Is Visual Design Foundations safe to install?

AIR scanned this exact version of Visual Design Foundations and recorded 0 findings and 2 flagged items. AIR's verdict: safe. The verdict is named by the content that was read, at commit ece811f23310, so it cannot drift onto a version nobody scanned. The full report is at https://airmarket.ai/security/visual-design-foundations.

### How do I install Visual Design Foundations?

Open https://airmarket.ai/app/visual-design-foundations on Air Market and use the install action: Air Market hands Claude a prompt naming this exact skill, and Claude sets it up. Source, pinned to the exact commit this listing describes: https://github.com/wshobson/agents/tree/ece811f23310a37ceb43496dbac0e244fe6845b6/plugins/ui-design/skills/visual-design-foundations. Install from that link, not the branch.

## Related on Air Market

- [More Design listings](/category/design)
- [Everything by Seth Hobson](/@wshobson)

---

Canonical URL: <https://airmarket.ai/app/visual-design-foundations>