Skip to content

Make Interfaces Feel Better

jakubkrehel/make-interfaces-feel-better

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.

By Jakub KrehelMIT licenseWorks with 3 agentsDesign and frontend

Facts checked on against the sources listed at the end of this page.

GitHub stars
3,771
Skills in the pack
1
Agents supported
3The README shows the skills CLI install and does not name specific agents
License
MIT
Last commit
1 month ago29 August 2026
Instruction size
1.8k wordsacross its SKILL.md file

How to install Make Interfaces Feel Better

AgentCommandCopy
Any agent
npx skills add jakubkrehel/make-interfaces-feel-better

Commands as given in the README on 3 October 2026.

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.

What is inside Make Interfaces Feel Better

Skill or commandWhat it makes the agent do
make-interfaces-feel-betterOne skill with reference files for typography, surfaces, animations, icons and performance.

The skill points to five reference files: typography, surfaces, animations, icons and performance.

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

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.

How much context Make Interfaces Feel Better uses

The skill1,842 words in its SKILL.md file
Loaded at startOnly 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.

Is Make Interfaces Feel Better still maintained?

Last commit, 1 month ago
Stars gained in 7 days+90
Stars gained in 30 daysShown after 30 days of tracking
Open issues and pull requests0
Forks159

Tools Make Interfaces Feel Better works with

Similar skill packs

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.

Sources

Something wrong or out of date? Email [email protected] with a link to the source. Stats come from the public GitHub API and update every day.

For the maker

Add the badge to your README or site. The number updates every day.

Claim this page
Make Interfaces Feel Better is listed on ScratchDB
Light
Make Interfaces Feel Better is listed on ScratchDB, dark version
Dark
Markdown[![Make Interfaces Feel Better on ScratchDB](https://scratchdb.com/badge/skills/make-interfaces-feel-better.svg)](https://scratchdb.com/skills/make-interfaces-feel-better/)
Markdown, dark[![Make Interfaces Feel Better on ScratchDB](https://scratchdb.com/badge/skills/make-interfaces-feel-better.svg?theme=dark)](https://scratchdb.com/skills/make-interfaces-feel-better/)
HTML<a href="https://scratchdb.com/skills/make-interfaces-feel-better/"><img src="https://scratchdb.com/badge/skills/make-interfaces-feel-better.svg" alt="Make Interfaces Feel Better on ScratchDB" width="290" height="52"></a>

Sharing on X? Open the share card with the pack's live numbers.

Make Interfaces Feel Better agent skill: install, what is inside and supported agents | ScratchDB