visual-design-foundations

visual-design-foundations is a skill in wshobson/agents, last changed 7 Mar 2026. It can name web addresses. Our pattern check flagged nothing at commit 0874a27 on 26 Oct 2026.

Pattern check: nothing flagged · commit 0874a27 · 26 Oct 2026

Install
From the author
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.
Licence
MIT
Repo stars
41.8k
Publisher
wshobson
Files
4 files
Checked
0874a27 (opens in a new tab) · 26 Oct 2026

Install

Each tab says whether it installs commit 0874a27, the one we checked, or the latest version.

No tab for your agent? Use Any agent for OpenCode, Goose, Windsurf (Devin Desktop), Zed, Roo Code, Factory Droid, Junie, Amp and Antigravity, and Claude Code for Cline. Kiro needs the folder copied by hand.

Pinned to commit 0874a27, the one we checked.

From your project's root folder:

tmp="$(mktemp -d)" &&
  git clone -q --depth 1 --filter=blob:none --no-checkout https://github.com/wshobson/agents.git "$tmp" &&
  git -C "$tmp" fetch -q --depth 1 origin 0874a27b17a22e2b7c2e2bcd725768e0803cad06 &&
  git -C "$tmp" sparse-checkout set -- plugins/ui-design/skills/visual-design-foundations &&
  git -C "$tmp" checkout -q 0874a27b17a22e2b7c2e2bcd725768e0803cad06 &&
  mkdir -p .claude/skills &&
  mkdir .claude/skills/visual-design-foundations &&
  cp -R "$tmp"/plugins/ui-design/skills/visual-design-foundations/. .claude/skills/visual-design-foundations/ &&
  rm -rf "$tmp"

If Claude Code was already running and this created the skills folder, run /reload-skills.

Or install the ui-design plugin it ships in. Installs the latest version, not the one we checked. Installs everything in the plugin, including any hooks, MCP servers and scripts our check doesn't cover.

claude plugin marketplace add wshobson/agents --scope project &&
  claude plugin install ui-design@claude-code-workflows --scope project
Claude Code docs (opens in a new tab)

What it can touch

From the files and frontmatter at commit 0874a27. This is how much a skill can do, not whether it is risky.

What it can touch: Scripts or outside hosts

  • Names web addresses

    It mentions outside web addresses the agent may visit. We list them but don't follow them.

Pattern check

Pattern check: nothing flagged · commit 0874a27 · 26 Oct 2026

We checked every text file in this skill, at commit 0874a27 on 26 Oct 2026, against 45 published patterns such as download-and-run commands, hidden text and credential access. We don't run the skill, we don't read the web pages it points to, and we can't judge everything its instructions might lead an agent to do. In published tests, pattern checks like this one missed most malicious skills. Read the skill before you install it — especially anything it asks you to download or run.

How the check worksReport an incorrect finding

Outside links we did not follow

  • http://www.w3.org/2000/svg

Format check

Each agent reads SKILL.md a little differently. We check the file against each one's published rules; we don't run the skill in any agent.

  • Agent Skills specPasses

    The open format from agentskills.io, held to what the strictest agents enforce, so one folder loads everywhere.

    • Note

      There is no license field, so readers can't tell whether they may reuse the skill. O2

      Fix: Add license: with an SPDX name such as MIT or Apache-2.0, or the name of a bundled licence file.

    • Note

      Reference files that SKILL.md doesn't link: references/color-systems.md, references/spacing-iconography.md and references/typography-systems.md. Anthropic suggests linking every reference file directly from SKILL.md. B4

      Fix: Link each one from SKILL.md and say when to read it.

    • Note

      Reference files over 100 lines with no table of contents at the top: references/color-systems.md (418 lines), references/spacing-iconography.md (426 lines) and references/typography-systems.md (433 lines). B5

      Fix: Add a short list of the sections at the top of each.

  • Claude CodePasses

    Claude Code reads its own extra fields, ignores unknown ones, and still loads a skill whose frontmatter is broken, without its fields.

    • Note

      Reference files that SKILL.md doesn't link: references/color-systems.md, references/spacing-iconography.md and references/typography-systems.md. Anthropic suggests linking every reference file directly from SKILL.md. B4

      Fix: Link each one from SKILL.md and say when to read it.

    • Note

      Reference files over 100 lines with no table of contents at the top: references/color-systems.md (418 lines), references/spacing-iconography.md (426 lines) and references/typography-systems.md (433 lines). B5

      Fix: Add a short list of the sections at the top of each.

  • Claude apps & API uploadPasses

    Uploading to claude.ai or the Claude API, or packaging with Anthropic's script, accepts only the six spec fields and stops on anything else.

    • Note

      The description is 217 characters. The claude.ai Help Center says 200 at most, though Anthropic's API docs and validator allow 1,024. D4

      Fix: If the claude.ai upload refuses it, trim the description to 200 characters.

    • Note

      Reference files that SKILL.md doesn't link: references/color-systems.md, references/spacing-iconography.md and references/typography-systems.md. Anthropic suggests linking every reference file directly from SKILL.md. B4

      Fix: Link each one from SKILL.md and say when to read it.

    • Note

      Reference files over 100 lines with no table of contents at the top: references/color-systems.md (418 lines), references/spacing-iconography.md (426 lines) and references/typography-systems.md (433 lines). B5

      Fix: Add a short list of the sections at the top of each.

  • OpenAI (Codex & API)Passes
  • VS Code & CopilotPasses

SKILL.md

Files

More from wshobson/agents

  • accessibility-compliance

    wshobson/agents

    Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building for screen readers, or ensuring inclusive user experiences.

    Pattern check: Nothing flaggedWhat it can touch: Names web addresses

    MIT · 41.8k repo stars · Updated 22 May 2026

  • ai-debt-detector

    wshobson/agents

    Use after generating code, after accepting AI suggestions, or when reviewing AI-written modules. Also use when code works but feels brittle, when error handling seems thin, when orphaned resources or missing cleanup are suspected, or when the agent claims done but hidden debt may exist. Catches the specific failure patterns AI agents produce that humans would not.

    Pattern check: Nothing flaggedWhat it can touch: Instructions only

    MIT · 41.8k repo stars · Updated 7 Jul 2026

  • airflow-dag-patterns

    wshobson/agents

    Build production Apache Airflow DAGs with best practices for operators, sensors, testing, and deployment. Use when creating data pipelines, orchestrating workflows, or scheduling batch jobs.

    Pattern check: Nothing flaggedWhat it can touch: Reaches the network

    MIT · 41.8k repo stars · Updated 22 May 2026

  • angular-migration

    wshobson/agents

    Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.

    Pattern check: Nothing flaggedWhat it can touch: Instructions only

    MIT · 41.8k repo stars · Updated 22 May 2026

  • anti-reversing-techniques

    wshobson/agents

    Understand anti-reversing, obfuscation, and protection techniques encountered during software analysis. Use this skill when analyzing malware evasion techniques, when implementing anti-debugging protections for CTF challenges, when reverse engineering packed binaries, or when building security research tools that need to detect virtualized environments.

    Pattern check: Nothing flaggedWhat it can touch: Runs shell commands

    MIT · 41.8k repo stars · Updated 28 Sept 2026

  • api-design-principles

    wshobson/agents

    Master REST and GraphQL API design principles to build intuitive, scalable, and maintainable APIs that delight developers. Use when designing new APIs, reviewing API specifications, or establishing API design standards.

    Pattern check: Nothing flaggedWhat it can touch: Bundles scripts

    MIT · 41.8k repo stars · Updated 22 May 2026

All skills in wshobson/agents