Updated 4d ago
by jakubkrehel
skills
A collection of agent skills that help you build great interfaces.
11k GitHub stars (11,032)
+3.5k in 30 days
| Period | New stars |
|---|---|
| Sep 27 | +5 |
| Sep 28 | +40 |
| Sep 29 | +80 |
| Sep 30 | +64 |
| Oct 1 | +7 |
| Oct 2 | +21 |
| Oct 3 | +15 |
| Oct 4 | +8 |
| Oct 5 | +21 |
| Oct 6 | +25 |
| Oct 7 | +28 |
| Oct 8 | +15 |
| Oct 9 | +67 |
| Oct 10 | +51 |
| Oct 11 | +80 |
| Oct 12 | +78 |
| Oct 13 | +66 |
| Oct 14 | +34 |
| Oct 15 | +28 |
| Oct 16 | +28 |
| Oct 17 | +41 |
| Oct 18 | +7 |
| Oct 19 | +25 |
| Oct 20 | +19 |
| Oct 21 | +60 |
| Oct 22 | +21 |
| Oct 23 | +36 |
| Oct 24 | +41 |
| Oct 25 | +44 |
| Oct 26 | +164 |
| Oct 27 | +283 |
| Oct 28 | +114 |
| Oct 29 | +171 |
| Oct 30 | +309 |
| Oct 31 | +90 |
| Nov 1 | +232 |
| Nov 2 | +420 |
| Nov 3 | +340 |
| Nov 4 | +247 |
| Nov 5 | +194 |
| Nov 6 | +218 |
- 14 skills (14 skills found in its SKILL.md files)
- 425 forks (425 forks)
- 4d ago last update (Last updated 4d ago)
Install
Skills CLI
npx skills add jakubkrehel/skills
Asks which skills and agents to install. Just one: npx skills add jakubkrehel/skills --skill better-accessibility — add -g for every project.
Claude Code
git clone https://github.com/jakubkrehel/skillscp -r "skills/skills/better-accessibility" ~/.claude/skills/
Copies the better-accessibility skill into ~/.claude/skills/ for every project (use .claude/skills/ for one project). Repeat for the other skills listed below.
Plugin
/plugin marketplace add jakubkrehel/skills
Run inside Claude Code if the repository ships a plugin marketplace, then pick plugins from /plugin.
Skills can run code on your machine — read the SKILL.md first.
What it does
In the author's own words, from each skill's SKILL.md.
-
better-accessibility
Reviews and fixes keyboard and focus behavior, ARIA, accessible names, forms, screen-reader announcements, motion and zoom against WCAG 2.2.
skills/better-accessibility/ on GitHub (opens in a new tab)SKILL.md -
better-colors
Builds and checks color systems by generating palettes, naming semantic tokens, converting between formats and measuring contrast.
skills/better-colors/ on GitHub (opens in a new tab)SKILL.md -
better-interface
Reviews a screen, flow or whole interface across accessibility, layout, writing, typography, color and UI polish, and returns one ranked report.
skills/better-interface/ on GitHub (opens in a new tab)SKILL.md -
better-layout
Sets grouping, alignment, reading order, responsive structure and room for translated text, so a layout holds up when it is resized, translated or mirrored.
skills/better-layout/ on GitHub (opens in a new tab)SKILL.md -
better-typography
Sets and reviews how text renders, from the type scale and spacing to font features, wrapping, truncation and punctuation.
skills/better-typography/ on GitHub (opens in a new tab)SKILL.md -
better-ui
Polishes surfaces, icons and motion with exact values for border radius, optical alignment, shadows, icon states and animation.
skills/better-ui/ on GitHub (opens in a new tab)SKILL.md -
better-writing
Writes and reviews interface copy, from labels and errors to empty states and confirmations, so it matches the product's voice and tells people what to do next.
skills/better-writing/ on GitHub (opens in a new tab)SKILL.md -
break
Renders a component you choose under every scenario that can reach it on a temporary page and stress tests it.
skills/break/ on GitHub (opens in a new tab)SKILL.md -
build-design
Builds UI from a Figma file or a design image so it matches the design, using the project's existing tokens and components.
skills/build-design/ on GitHub (opens in a new tab)SKILL.md -
explain-interface
Explains how a website, a visual effect or an animation was built, from a live URL or a screenshot.
skills/explain-interface/ on GitHub (opens in a new tab)SKILL.md -
interface-review
Reviews a branch, pull request or uncommitted change for the interface problems it introduced or regressed, across accessibility, layout, writing, typography, color and UI.
skills/interface-review/ on GitHub (opens in a new tab)SKILL.md -
state-machine
Renders every state of a component you choose on a throwaway page, with mock data and a switcher, so you can work on each state.
skills/state-machine/ on GitHub (opens in a new tab)SKILL.md -
teardown
Creates technical illustrations of physical objects and of how things work, such as display pixels or interface layers, with coherent views, fine linework and part fills.
skills/teardown/ on GitHub (opens in a new tab)SKILL.md -
variant
Builds multiple variants of a component you're working on and helps you iterate and pick one.
skills/variant/ on GitHub (opens in a new tab)SKILL.md
No skill matches that filter.
Review before you install
A skill is a set of instructions and scripts your agent will follow, and it can run code on your machine. Read the SKILL.md and any scripts first — this listing is not a security review.