Apple Hig Designer
Design Apple-style iOS/macOS interfaces following Human Interface Guidelines. Creates HIG-compliant components with SF Symbols, San Francisco typography, and proper accessibility. Supports optional modern effects. Use when designing Apple-style UI, iOS/macOS interfaces, HIG-compliant components, or implementing design system specifications.
Install
npx skills add axiaoge2/Apple-Hig-Designer --skill apple-hig-designergit clone --depth 1 https://github.com/axiaoge2/Apple-Hig-Designer.git /tmp/Apple-Hig-Designer
mkdir -p ~/.claude/skills
cp -r /tmp/Apple-Hig-Designer/. ~/.claude/skills/apple-hig-designerPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# Apple HIG Designer A professional-grade frontend design skill that enables Claude Code to create interfaces following Apple's Human Interface Guidelines (HIG), achieving the quality standards of Apple's design team. ## When to Use This Skill Activate this skill when users request: - Apple-style or iOS/macOS-style interfaces - HIG-compliant UI components - SF Symbols integration - San Francisco typography implementation - Modern glass effects (optional, user must explicitly request) **Trigger phrases:** - "Design an Apple-style..." - "Create a HIG-compliant..." - "iOS/macOS style component" - "苹果风格的界面" - "符合 HIG 的设计" --- ## Core Design Principles ### The Four Pillars of Apple Design 1. **Clarity (清晰)** - Every element has a purpose - Eliminate unnecessary complexity - Users understand immediately without instructions - Use clear visual hierarchy 2. **Deference (尊重内容)** - UI elements support, not compete with content - Minimize chrome and visual noise - Let content be the hero - Use subtle backgrounds and borders 3. **Depth (层次)** - Create clear visual hierarchy through layers - Use shadows, blur, and translucency purposefully - Motion reinforces spatial relationships - Z-axis communicates importance 4. **Consistency (一致性)** - Familiar patterns across platforms - Predictable interactions - Unified visual language - Respect platform conventions --- ## Design System Specifications ### Typography System
Details
- Skill name
apple-hig-designer- Repository
- axiaoge2/Apple-Hig-Designer
- License
- MIT
- Repo updated
- 17 February 2026
FAQ
What does the Apple Hig Designer skill do?
Design Apple-style iOS/macOS interfaces following Human Interface Guidelines. Creates HIG-compliant components with SF Symbols, San Francisco typography, and proper accessibility. Supports optional modern effects. Use when designing Apple-style UI, iOS/macOS interfaces, HIG-compliant components, or implementing design system specifications.
How do I install the Apple Hig Designer skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add axiaoge2/Apple-Hig-Designer --skill apple-hig-designer. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Apple Hig Designer popular?
It lives in axiaoge2/Apple-Hig-Designer, which has 212 GitHub stars and 23 forks.
Related skills
Diorama
196sloemo01/diorama
Use when building a pixel diorama in Three.js — one-prompt autonomous builds with staged systems, detailed props, real animation, and social/service choreography.
2dimg2motion
239WU-HAOTIAN34/2dimg2motion
Use when a user provides one baseline image and requests game animation frames, sprite sequences, attack/walk/idle/hit/death/casting motion, transparent PNG frames, a spritesheet, keyframe prompts, or consistent whole-character pose animation.
Code Brand Film
181nutllwhy/code-brand-film
Produce a short brand film or product promo (10-60s, typically 15s) entirely as code: one static HTML page with a paused GSAP timeline that a renderer seeks frame by frame, plus a music score synthesized in Python. Use when the user wants a 品牌宣传片, 广告片, 宣传动画, 产品短片, 发布会开场视频, brand film, promo video, product teaser, logo animation, or a generated ad spot — especially when they ask for 高级感 / 艺术感 / 电影感 / 别像模板, or when an existing video "looks like AI made it" or "too simple" and needs to be redone properly. Also use when a film already exists and needs a score, a soundtrack, background music, or 配乐
Claude Design
213jiji262/claude-design-skill
Produce thoughtful, high-fidelity design artifacts in HTML — landing pages, slide decks, interactive prototypes, animated videos, posters, wireframes, and visual explorations. Use whenever the user asks to design, mock up, prototype, visualize, storyboard, or explore UI options — including phrases like "make a deck", "design a landing page", "prototype this flow", "animate this concept", "build a pitch deck", "create a poster", "visualize this idea", or "design something for a brand". Enforces fact verification (WebSearch before assuming a product exists or its version), the Core Asset Protoco
Blcaptain Style Skill
178dososo/blcaptain-style-skill
当用户需要把内容(文章、笔记、截图、数据、产品说明)做成中文图文卡片组图时使用——小红书 / Rednote 3:4 竖图、公众号封面、社交卡。提供三套独家视觉语言(静纸 Still Paper本手记 / Signal Proof 证据层 / Bridge Canvas 跨平台桥),由 Claude 读懂内容、自己撰写 brief.json,交给确定性引擎渲染出第一眼惊艳、一眼可辨、国内开箱即用的图文组图。
UX Writing
249content-designer/ux-writing-skill
Create user-centered, accessible interface copy (microcopy) for digital products including buttons, labels, error messages, notifications, forms, onboarding, empty states, success messages, and help text. Use when writing or editing any text that appears in apps, websites, or software interfaces, designing conversational flows, establishing voice and tone guidelines, auditing product content for consistency and usability, reviewing UI strings, or improving existing interface copy. Applies UX writing best practices based on four quality standards — purposeful, concise, conversational, and clear
Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.