/make-interfaces-feel-better

An agent skill focused on the small details that make interfaces feel better.

npx skills add jakubkrehel/make-interfaces-feel-better
SkillsGitHub

It is based on the article "Details that make interfaces feel better" and the skill contains a lot of small tips that I personally use when building interfaces.

wrap

Designing interfaces

Great design is invisible. It guides users without them ever noticing.

balance + pretty

Designing interfaces

Great design is invisible. It guides users without them ever noticing.

Width220px
padding: 8px
12px
12px
20px
12px
Image Border

It is available for Claude Code, Codex, Cursor Agent and many more. After installation, run /make-interfaces-feel-better to get started.

jakub@jakub's-macbook-pro.local~
→ interfaces git:(main) ✗ claude
Claude Code v2.1.162Opus 4.8 (1M context) · Claude Max~/Developer/interfaces
>/make-interfaces-feel-better
/make-interfaces-feel-betterDesign engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover states, shadows, borders, typography, micro-interactions, enter/exit animations, or any visual detail work. Triggers on UI polish, design details, "make it feel better", "feels off", stagger animations, border radius, optical alignment, font smoothing, tabular numbers, image outlines, box shadows.

The skill helps with a lot of aspects of UI such as typography, hover states, optical alignment, concentric border radius, using shadows and much more.

Before
1,204
After
1,204

After the skill runs you'll get a comprehensive summary of the changes made. You can ask any follow up questions and the agent will help answer them.