Repolode
Submit
emilkowalski

emilkowalski/skills

A collection of agent skills that teach AI coding assistants animation, UI design and frontend craft rules drawn from the author's experience at Vercel and Linear.

View on GitHubWebsite
Stars
47,495
Forks
2,737
Open issues
4
Last commit
9 days ago

What is it?

This repository is a set of installable agent skills for designers and engineers who build user interfaces. Each skill is a SKILL.md file that gives an AI coding agent specific guidance, such as which easing curve to use for an enter animation, when a semi-transparent shadow beats a solid border, or how to avoid frame drops in animations.

The skills cover several areas: animation design and review (animate, review-animations, animation-performance, animation-vocabulary), React Native and Expo motion, Apple-style interface principles, Swift coding guidance, choosing UI libraries, prototyping multiple UI variants, mobile web polish, and stress-testing interfaces with worst-case data. Sonner, a toast component library, also has its own setup and troubleshooting skill.

Installation uses the npx skills CLI with a single command. The skills are written by a single author and reflect that author's personal design opinions, so they suit teams that want an agent to follow a specific, opinionated standard.

Key features

  • 01Animation guidance covering easing, duration, and which properties to animate.
  • 02Review and audit skills that scan a codebase for animation issues and produce prioritized fixes.
  • 03Performance skill focused on fixing dropped frames in animations.
  • 04React Native and Expo skill for gestures, sheets, haptics, and screen transitions.
  • 05Swift skill covering value types, Swift 6 concurrency, and Swift Testing.
  • 06Install with a single npx command.

Use cases

  • Having an AI coding agent add or review animations in a React or web interface.
  • Auditing an existing app for animation mistakes and getting a prioritized fix plan.
  • Building a React Native or Expo app with polished gestures and transitions.
  • Stress-testing a UI with long names, empty lists, and unusual data before release.

Quick start

  1. 1

    Install the skills into your agent

    npx skills@latest add emilkowalski/skills

Things to know

  • The skills are guidance for AI coding assistants rather than a standalone application.
  • Some skills target specific stacks such as React Native/Expo, Swift, or Sonner, so they only help if you use those tools.

Topics

#ai-agents#animation#ui-design#frontend#react-native#swift#css#prompt-engineering

FAQ

What is skills?
A collection of agent skills that teach AI coding assistants animation, UI design and frontend craft rules drawn from the author's experience at Vercel and Linear. This repository is a set of installable agent skills for designers and engineers who build user interfaces. Each skill is a SKILL.md file that gives an AI coding agent specific guidance, such as which easing curve to use for an enter animation, when a semi-transparent shadow beats a solid border, or how to avoid frame drops in animations.
Is skills free to use? What license does it have?
skills is open source under the MIT license. Check the license terms before using it in commercial products.
Is skills still maintained?
Actively maintained. The last commit to skills was on Oct 11, 2026.
What can I use skills for?
Having an AI coding agent add or review animations in a React or web interface. Auditing an existing app for animation mistakes and getting a prioritized fix plan. Building a React Native or Expo app with polished gestures and transitions. Stress-testing a UI with long names, empty lists, and unusual data before release.
How do I install skills?
Install the skills into your agent: npx skills@latest add emilkowalski/skills
Where can I get skills?
The source code and installation instructions are on GitHub: https://github.com/emilkowalski/skills

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects