emil-design-eng is Emil Kowalski's agent skill for interface polish: one 27,226-byte SKILL.md and nothing else. It opens with a scripted first reply, spends most of its animation framework arguing against animating, swaps the CSS easing keywords for three cubic-bezier constants, and requires a Before/After/Why table in every review. It has 243,573 installs as of September 2, 2026 (Skillselion catalog).
"emil kowalski design skill" is a breakout rising query on Google Trends today, September 2, 2026 (past 30 days, worldwide). Most pages answering it repeat the one-line description, so we read the file section by section for the emil-design-eng deep dive on Skillselion. This is the developer cut: what the file instructs an agent to do, and where it argues with itself. Its last commit in emilkowalski/skills is dated July 21, 2026, so what we read on August 20 is what installs today.
Disclosure: we run Skillselion, an independent directory of agent skills (live catalog, refreshed daily from skills.sh, GitHub and MCP registries, ranked by real installs). We are not affiliated with Anthropic, OpenAI, Cursor or Emil Kowalski.
What does emil-design-eng say before you ask anything?
On an invocation with no question attached, the "Initial Response" section fixes the reply to one line. It begins "I'm ready to help you build interfaces that feel right, my knowledge comes from Emil Kowalski's design engineering philosophy." and ends by pointing at the author's course at animations.dev. Then:
Do not provide any other information until the user asks a question.
Source: SKILL.md, "Initial Response"
The wait rule is sound. A 27KB payload with no question to spend it on should stay latent. The course link is a marketing placement written as an instruction, one sentence, once. Know it is there before the agent's output reaches a customer.
Does the emil-design-eng skill tell the agent to animate?
Mostly it tells the agent not to. Four questions are asked in order, and the first is whether to animate at all, answered by a frequency table whose top row (keyboard shortcuts, command palette toggle) reads "No animation. Ever."
Never animate keyboard-initiated actions. These actions are repeated hundreds of times daily. Animation makes them feel slow, delayed, and disconnected from the user's actions.
Source: SKILL.md, "Should this animate at all?"
Question two demands a purpose from a list of five and rules that "it looks cool" on something seen often is a no. About half of the opening framework in a skill filed under polish is a brake, and that is the part an agent needs most, because an agent asked to make a component feel alive will otherwise animate everything it can reach.
Which easing curves does emil-design-eng ship?
Question three routes entrances and exits to ease-out, on-screen movement to ease-in-out, hover and color changes to ease, constant motion to linear, then rejects the default shape of all four.
Critical: use custom easing curves. The built-in CSS easings are too weak. They lack the punch that makes animations feel intentional.
Source: SKILL.md, "What easing should it use?"
/* Strong ease-out for UI interactions */
--ease-out: cubic-bezier(0.23, 1, 0.32, 1);
/* Strong ease-in-out for on-screen movement */
--ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
/* iOS-like drawer curve (from Ionic Framework) */
--ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
Source: SKILL.md, "What easing should it use?"
One keyword is banned for interface work: "Never use ease-in for UI animations." The reason is mechanical. ease-in delays the initial movement, which is the moment the user watches most closely, and a rule with a mechanism is one an agent can extend to cases the file never lists. The same three values sit, identical, in at least four sibling files at the commit we read, so installing this skill next to animate, find-animation-opportunities, review-animations or improve-animations puts the constants in context twice.
Why does the duration table contradict its own rule?
Question four is a five-row table: button press feedback 100-160ms, modals and drawers 200-500ms. Printed under it:
Rule: UI animations should stay under 300ms. A 180ms dropdown feels more responsive than a 400ms one.
Source: SKILL.md, "How fast should it be?"
A drawer is a UI element, and the row three lines up allows it 500ms. A person reads 300ms as the default and 500ms as the allowance for the largest surfaces. The file never says so, and the closing checklist turns 300ms into a defect:
| Duration > 300ms on UI element | Reduce to 150-250ms |
Source: SKILL.md, "Review Checklist"
So a 400ms drawer that question four permits gets flagged when the same skill reviews the code, with a fix band the duration table never offers drawers. An agent applies both halves as written.
What does a review look like with emil-design-eng installed?
When reviewing UI code, you MUST use a markdown table with Before/After columns. Do NOT use a list with "Before:" and "After:" on separate lines.
Source: SKILL.md, "Review Format (Required)"
A five-row example follows, then a fenced block labelled as the wrong format, showing the list layout the author did not want. Printing the output you do not want is a correction aimed at a habit the author kept seeing. The Why column forces a reason per row, and an eleven-row issue-to-fix checklist closes the file, so a review has a mandated shape and a mandated sweep. Ask to "review my animation code" and the prose list you got before becomes a table, one row per issue.
Which Emil Kowalski skills should you install alongside it?
The repo has 34,182 stars as of September 2, 2026 (Skillselion catalog). The ranked shortlist, installs as of the same date (Skillselion catalog):
| Skill | Installs | Job | Source |
|---|---|---|---|
| emil-design-eng skill | 243,573 | The reference corpus | GitHub |
| review-animations skill | 133,796 | Audits existing motion, standards file beside it | GitHub |
| animation-vocabulary skill | 121,235 | Vague motion description to precise term | GitHub |
| apple-design skill | 114,701 | Gestures, springs, sheets | GitHub |
| improve-animations skill | 106,122 | Read-only audit of shipped animation code, with fix plans | GitHub |
| find-animation-opportunities skill | 93,723 | Where motion is missing | GitHub |
| pick-ui-library skill | 77,984 | One opinionated component-library pick per task | GitHub |
| prototype skill | 66,855 | Several working versions of one UI piece behind a picker | GitHub |
Should you install emil-design-eng?
Install it if you want one opinionated reference in context for interaction work and would rather over-fetch than route. The brake is the strongest part, and the performance rules read like notes from shipped libraries rather than a style guide (the file names Sonner and Vaul, and cites a dropped-frames fix on the Vercel dashboard). Some passages are written for a person, such as testing gestures on a real phone over USB; an agent cannot execute those, so they hold up as reference a human consults through it.
Skip it if your context budget is tight. It is the largest file in the repo, about 20 percent above apple-design at 22,715 bytes, and the only model-invocable skill there whose description has no "Use when" clause, so the biggest file has the weakest routing. Skip it too if you expected a design system; there is no color, spacing or layout guidance in it. For that half, the design-taste-frontend skill and Anthropic's frontend-design skill sit beside it on the best skills for frontend design shortlist, ranked by real installs.
npx skills add https://github.com/emilkowalski/skills --skill emil-design-eng
More files read this way: the Skillselion Deep Dives series.
FAQ
Is emil-design-eng the same as the other Emil Kowalski skills? No. The README lists it first as the main skill; the task-shaped siblings repeat the constants and the frequency framework they need, rewritten in their own words.
How much context does it cost? 27,226 bytes at the commit we read, the largest SKILL.md in the repo, and the catalog lists it as the only file that ships.
Does it work outside React? The reasoning does. The samples assume CSS, React and Motion, so a Vue or Svelte codebase gets the rules and none of the copy-paste.
Last updated September 2, 2026. Every quote verified against emilkowalski/skills, skills/emil-design-eng/SKILL.md (last commit July 21, 2026).
Top comments (0)