apple-design

An agent skill by emilkowalski, from emilkowalski/skills. Tags: animation, design, web.

What it does

Apple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring animations, drag/swipe/sheet interactions, momentum and interruptible transitions, translucent materials and depth, typography (optical sizing, tracking, leading), reduced-motion, or the design foundations (feedback, spatial consistency, restraint) behind Apple-style interfaces.

Install

With the skills CLI, which installs into Claude Code, Codex, Cursor and other agents:

npx skills add emilkowalski/skills --skill apple-design

Or copy the skill folder into Claude Code's skills directory by hand (~/.claude/skills for every project, or .claude/skills inside one):

git clone --depth 1 https://github.com/emilkowalski/skills
cp -r skills/skills/apple-design ~/.claude/skills/apple-design

Safety box score

Not rated yet. A safety box score grades what a skill and its scripts can reach on the machine of whoever installs it, across eight categories from shell execution to secrets access. Anyone can request one from this page; it is saved for everyone. How the score works.

Source

Repository

emilkowalski/skills (all skills from this repository)

Path

skills/apple-design/SKILL.md

Branch

main

Updated

2026-09-22

Related skills

• animate — Build an animation from scratch, making the decisions in the order that determines whether it feels right — should it animate at all, what purpose, which tool.
• animate-expo — Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate.
• animation-vocabulary — Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop.
• ask-sonner — Guide to Sonner, the React toast library — install and wire up the Toaster, pick the right toast() call, promise and loading toasts, updating.
• emil-design-eng — This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great.
• find-animation-opportunities — Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't.