Make Interfaces Feel Better
jakubkrehel/make-interfaces-feel-better
One skill of design engineering rules for animation, typography, shadows, icons and hit areas.
Make Interfaces Feel Better is an MIT-licensed agent skill by Jakub Krehel that covers the small details that make an interface feel polished. It gives the agent rules for animation, typography, icons, hover states, optical alignment, concentric border radius, shadows and hit areas. It works for building UI and for reviewing front-end code, in a quick or full review.
Facts checked on against the sources listed at the end of this page.
- GitHub stars
- 3,563
- Skills in the pack
- 1
- Agents supported
- 3The README shows the skills CLI install and does not name specific agents
- Instruction size
- 1.8k wordsacross its SKILL.md file
How to install Make Interfaces Feel Better
| Agent | Command | Copy |
|---|---|---|
| Any agent | |
Commands as given in the README on 3 October 2026.
What is inside Make Interfaces Feel Better
| Skill or command | What it makes the agent do |
|---|---|
| make-interfaces-feel-better | One skill with reference files for typography, surfaces, animations, icons and performance. |
The skill points to five reference files: typography, surfaces, animations, icons and performance.
What Make Interfaces Feel Better runs on your machine
| Hooks | None found in the repo. |
|---|---|
| Bundled scripts | None found. The repo holds Markdown files. |
| Network calls | None named in the README. |
| API keys needed | None named in the README. |
These are facts read from the repo, not a security rating. Read the files before you install any skill.
How much context Make Interfaces Feel Better uses
| The skill | 1,842 words in its SKILL.md file |
|---|---|
| Loaded at start | Only each skill's name and description. The full text loads when a task needs that skill. |
Word counts are measured from the repo every day. Reference files a skill loads on demand are not counted.
How Make Interfaces Feel Better works
The skill opens with a list of core principles, such as making the outer border radius equal the inner radius plus padding, aligning optically instead of geometrically, and using layered transparent shadows for depth while keeping borders for structure. It also says to prefer CSS transitions for interactive states because they can be interrupted mid-animation.
For reviews, it tells the agent to replay motion at 10 percent speed in the browser's Animations panel and walk every state, including hover, focus, active, loading and empty. It asks the agent to identify the project's existing styling system and express each fix in it.
A good fit for
- Front-end developers who want agents to check animation, shadow and radius details in a pull request
- Designers who write UI code and want a checklist of polish rules
- Teams that want one small skill, not a large collection
- Projects that use CSS, Tailwind or motion libraries, since fixes follow the existing styling system
Skip it if
- Back-end work, because every rule is about interface details
- Teams that want a full design process, since the skill covers polish only
- Anyone who needs deep animation coverage with separate build and review skills
Is Make Interfaces Feel Better still maintained?
| Last commit | , 1 month ago |
|---|---|
| Stars gained in 7 days | Shown after 7 days of tracking |
| Stars gained in 30 days | Shown after 30 days of tracking |
| Open issues and pull requests | 0 |
| Forks | 146 |
Tools Make Interfaces Feel Better works with
Questions about Make Interfaces Feel Better
How do I install it?
Run npx skills add jakubkrehel/make-interfaces-feel-better.
Is it free?
Yes. It is MIT licensed.
What does it cover?
Animations, typography, icons, hover states, optical alignment, concentric border radius, shadows and hit areas, with a reference file for each area.
Can it review existing code?
Yes. The skill description says it supports quick and full reviews of front-end code.
Does it run any code?
No scripts or hooks were found. It is Markdown.