ax-design

ax-design is a skill for Claude Code from Kasempiternal/axiom-v2. It costs 41 tokens per session (2,907 once invoked), scanned A, original, MIT.

A guide to Apple’s Human Interface Guidelines and SF Symbols, Apple’s built-in icon library, for designing iOS interfaces.

In plain words
What is it for?
Choose system backgrounds, text emphasis, symbol rendering modes, symbol effects, and other interface details for Apple-platform apps.
Why use it?
It helps developers make consistent design choices for colors, text hierarchy, icon styles, animation, and accessibility.

Skill for Claude Code

Written for Claude Code: shipped in a Claude Code plugin.

Part of the axiom plugin — 40 skills, 8 commands, 12 agents, 2 hooks shipped together

Good fit Choose system backgrounds, text emphasis, symbol rendering modes, symbol effects, and other interface details for Apple-platform apps.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/kasempiternal/axiom-v2/ax-design
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add Kasempiternal/axiom-v2 --skill ax-design
Clone the repo
git clone --depth 1 https://github.com/Kasempiternal/axiom-v2

Made for: Claude Code.

Or install axiom, the plugin that ships this one along with the rest of its 40 skills, 8 commands, 12 agents, 2 hooks.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for ax-design

README.md
[![agentmods](https://agentmods.dev/badge/skills/kasempiternal/axiom-v2/ax-design/github.svg)](https://agentmods.dev/skills/kasempiternal/axiom-v2/ax-design)
Your own site
<a href="https://agentmods.dev/skills/kasempiternal/axiom-v2/ax-design"><img src="https://agentmods.dev/badge/skills/kasempiternal/axiom-v2/ax-design/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for ax-design

Your own site · 80×15
<a href="https://agentmods.dev/skills/kasempiternal/axiom-v2/ax-design"><img src="https://agentmods.dev/badge/skills/kasempiternal/axiom-v2/ax-design.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 41 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,907 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00041 $0.02907
Opus 5.5 $0.00016 $0.01163
Sonnet 5.5 $0.00008 $0.00581
Haiku 4.5 $0.00004 $0.00291

Measured 1mo ago against content hash 1c237b874bcc, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

ax-design scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

axiom-plugin/skills/ax-design/SKILL.md · 332 lines

How it starts

The opening of the file, as written. The whole thing — 332 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Apple Design & SF Symbols

Quick Patterns

Background Color Decision

Is your app media-focused (photos, videos, music)?
+-- Yes --> permanent dark appearance (.preferredColorScheme(.dark))
+-- No  --> system backgrounds (respect user Light/Dark preference)
         systemBackground (main), systemGroupedBackground (Settings-style)

Label Hierarchy

Text("Title").foregroundStyle(.primary)
Text("Subtitle").foregroundStyle(.secondary)
Text("Detail").foregroundStyle(.tertiary)
Text("Disabled").foregroundStyle(.quaternary)

SF Symbol Rendering Mode Selection

Need depth from ONE color?        --> Hierarchical
Need specific colors per layer?   --> Palette
Want Apple's curated colors?      --> Multicolor
Just need a tinted icon?          --> Monochrome (default)

Symbol Effect Selection

User tapped something             --> .bounce (discrete)
Draw attention to change          --> .wiggle (discrete, iOS 18+)
Ongoing process / loading         --> .pulse, .breathe, .variableColor (indefinite)
Rotation indicates progress       --> .rotate (indefinite, iOS 18+)
Show/hide symbol                  --> .appear / .disappear (transition)
Swap between two symbols          --> .replace (content transition)
Hand-drawn entry/exit             --> .drawOn / .drawOff (iOS 26+)
Progress along path               --> Variable Draw (iOS 26+)

Bounce on Tap

@State private var count = 0

Image(systemName: "arrow.down.circle")
    .symbolEffect(.bounce, value: count)

Content Transition (Symbol Swap)

Image(systemName: isFavorite ? "star.fill" : "star")
    .contentTransition(.symbolEffect(.replace))
    .accessibilityLabel(isFavorite ? "Remove from favorites" : "Add to favorites")

Decision Tree

What design question do you have?
|
+-- Background color?
|   +-- Media-focused app --> permanent dark
|   +-- Everything else --> systemBackground (adapts to light/dark)
|   +-- Grouped content --> systemGroupedBackground
|
+-- Color choice?
|   +-- UI elements --> semantic colors (label, secondaryLabel, etc.)
|   +-- Brand color needed --> Color Set in asset catalog (light + dark + high contrast)
|   +-- Never hardcode --> Color.black / Color.white
|
+-- Font weight?
|   +-- Avoid: Ultralight, Thin, Light (legibility issues)
|   +-- Headers: Semibold or Bold
|   +-- Body: Regular or Medium
|
+-- SF Symbol rendering?
|   +-- Single tint --> Monochrome (default)
|   +-- Depth from one hue --> Hierarchical
|   +-- Brand/status colors --> Palette (explicit per-layer)
|   +-- Apple's curated colors --> Multicolor (not all symbols support it)
|
+-- Symbol animation?
|   +-- Tap feedback --> Bounce (discrete, value: trigger)
|   +-- Loading/waiting --> Pulse or Breathe (indefinite, isActive: bool)
|   +-- WiFi/signal cycling --> Variable Color (indefinite)
|   +-- Processing spinner --> Rotate (indefinite, iOS 18+)
|   +-- Attention shake --> Wiggle (discrete, iOS 18+)
|   +-- Swap symbols --> Replace content transition
|   +-- Pen-drawn entry --> Draw On (iOS 26+)
|
+-- Light/Dark mode?
|   +-- Always support both, never create app-specific toggle
|   +-- Use semantic colors that adapt automatically
|
+-- Touch targets?
    +-- iOS/iPadOS: 44x44 points minimum
    +-- macOS: 20x20 points minimum
    +-- Contrast: 4.5:1 minimum, 7:1 for small text

Read the full file on GitHub · 332 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 1mo ago First seen · 332 lines · 41 tokens per session scan A 1c237b874bcc

Subscribe to this mod's changes

ax-design is a skill published in the GitHub repository Kasempiternal/axiom-v2 (4 stars, last pushed 7mo ago), licensed MIT. It adds 41 tokens to every session and 2,907 once invoked, about $0.0002 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.

Related

Other skills, from other repositories

ttb-skill-native-swiftui-components

Build reusable native SwiftUI UI components using 100% standard SwiftUI primitives with TTBaseUIKit design tokens, localization, chainable modifiers, and project architecture rules. NO TTBaseSUI wrappers. iOS 14+.

tqtuan1201/TTBaseUIKit · 55 tokens

human-interface-guidelines

Route Human Interface Guidelines (Foundations) design tasks to the correct Knowledge Contracts — layout, color, typography, dark mode, materials, motion, app icons, interface icons, images, branding, accessibility design, inclusion, privacy-design permission UI, SF Symbols usage, right-to-left support, and designing…

caglarbaranbora/Apple-Agent-Kit · 234 tokens

swiftui-liquid-glass

Implement or review SwiftUI Liquid Glass for iOS 26+, including glass effects and containers, controls, toolbars, tab bars, morphing transitions, tinting, scroll edges, background extension, and availability fallbacks. Use when adopting the Liquid Glass visual system.

thiennc-tesoglobal/ios-skills · 60 tokens

human-interface-guidelines-components

Route Human Interface Guidelines Components/Inputs design tasks to the correct Knowledge Contracts -- lists and tables, buttons, sheets, alerts, action sheets, navigation bars, tab bars, pickers, toggles, text fields, menus, and touchscreen gestures. Use when designing or reviewing iOS/iPadOS list/table layout, button…

caglarbaranbora/Apple-Agent-Kit · 163 tokens

human-interface-guidelines-patterns

Route Human Interface Guidelines Patterns design tasks to the correct Knowledge Contracts -- onboarding, searching, settings, notifications, feedback, and undo/redo. Use when designing or reviewing an iOS/iPadOS first-run flow, in-app search placement, settings-screen structure, notification content/timing…

caglarbaranbora/Apple-Agent-Kit · 139 tokens

sf-symbols

Route SF Symbols API implementation tasks to the correct Knowledge Contracts — symbol basics (Image(systemName:)/UIImage(systemName:)), rendering modes, symbol variants, variable value symbols, weight/scale, color/tinting mechanics, custom symbol usage, and UIKit SymbolConfiguration composition. Use when writing or…

caglarbaranbora/Apple-Agent-Kit · 186 tokens