Updated 8mo ago
by ihlamury
design-skills
Opinionated UI constraints extracted from the best design systems. Use with AI agents to build pixel-accurate interfaces.
105 GitHub stars (105)
+14 in 30 days
| Period | New stars |
|---|---|
| Oct 1 | 0 |
| Oct 2 | 0 |
| Oct 3 | +1 |
| Oct 4 | 0 |
| Oct 5 | 0 |
| Oct 6 | 0 |
| Oct 7 | +2 |
| Oct 8 | 0 |
| Oct 9 | 0 |
| Oct 10 | 0 |
| Oct 11 | 0 |
| Oct 12 | +2 |
| Oct 13 | 0 |
| Oct 14 | 0 |
| Oct 15 | 0 |
| Oct 16 | 0 |
| Oct 17 | 0 |
| Oct 18 | 0 |
| Oct 19 | +1 |
| Oct 20 | 0 |
| Oct 21 | +1 |
| Oct 22 | 0 |
| Oct 23 | +1 |
| Oct 24 | +1 |
| Oct 25 | 0 |
| Oct 26 | 0 |
| Oct 27 | +1 |
| Oct 28 | +1 |
| Oct 29 | +1 |
| Oct 30 | 0 |
| Oct 31 | +1 |
| Nov 1 | 0 |
| Nov 2 | 0 |
| Nov 3 | 0 |
| Nov 4 | 0 |
| Nov 5 | +2 |
- 30 skills (30 skills found in its SKILL.md files)
- 13 forks (13 forks)
- 8mo ago last update (Last updated 8mo ago)
Install
Skills CLI
npx skills add ihlamury/design-skills
Asks which skills and agents to install. Just one: npx skills add ihlamury/design-skills --skill airbnb-ui-skills — add -g for every project.
Claude Code
git clone https://github.com/ihlamury/design-skillscp -r "design-skills/skills/airbnb" ~/.claude/skills/
Copies the airbnb-ui-skills skill into ~/.claude/skills/ for every project (use .claude/skills/ for one project). Repeat for the other skills listed below.
Plugin
/plugin marketplace add ihlamury/design-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 — showing the first 30 of 87 files.
-
airbnb-ui-skills
Airbnb's UI design system. Use when building interfaces inspired by Airbnb's aesthetic - light mode, Inter font, 4px grid.
skills/airbnb/ on GitHub (opens in a new tab)SKILL.md -
airtable-ui-skills
Airtable's UI design system. Use when building interfaces inspired by Airtable's aesthetic - light mode, Inter font, 4px grid.
skills/airtable/ on GitHub (opens in a new tab)SKILL.md -
amplitude-ui-skills
Amplitude's UI design system. Use when building interfaces inspired by Amplitude's aesthetic - light mode, Inter font, 4px grid.
skills/amplitude/ on GitHub (opens in a new tab)SKILL.md -
anthropic-ui-skills
Anthropic's UI design system. Use when building interfaces inspired by Anthropic's aesthetic - light mode, Inter font, 4px grid.
skills/anthropic/ on GitHub (opens in a new tab)SKILL.md -
apple-ui-skills
Apple's UI design system. Use when building interfaces inspired by Apple's aesthetic - light mode, Inter font, 4px grid.
skills/apple/ on GitHub (opens in a new tab)SKILL.md -
arc-ui-skills
Arc's UI design system. Use when building interfaces inspired by Arc's aesthetic - light mode, Inter font, 4px grid.
skills/arc/ on GitHub (opens in a new tab)SKILL.md -
ashby-ui-skills
Ashby's UI design system. Use when building interfaces inspired by Ashby's aesthetic - dark mode, Inter font, 4px grid.
skills/ashby/ on GitHub (opens in a new tab)SKILL.md -
awwwards-ui-skills
Awwwards's UI design system. Use when building interfaces inspired by Awwwards's aesthetic - light mode, Inter font, 4px grid.
skills/awwwards/ on GitHub (opens in a new tab)SKILL.md -
bear-ui-skills
Bear's UI design system. Use when building interfaces inspired by Bear's aesthetic - light mode, Inter font, 4px grid.
skills/bear/ on GitHub (opens in a new tab)SKILL.md -
beehiiv-ui-skills
Beehiiv's UI design system. Use when building interfaces inspired by Beehiiv's aesthetic - light mode, Inter font, 4px grid.
skills/beehiiv/ on GitHub (opens in a new tab)SKILL.md -
brex-ui-skills
Brex's UI design system. Use when building interfaces inspired by Brex's aesthetic - light mode, Inter font, 4px grid.
skills/brex/ on GitHub (opens in a new tab)SKILL.md -
cal-ui-skills
Cal's UI design system. Use when building interfaces inspired by Cal's aesthetic - light mode, Inter font, 4px grid.
skills/cal/ on GitHub (opens in a new tab)SKILL.md -
clerk-ui-skills
Clerk's UI design system. Use when building interfaces inspired by Clerk's aesthetic - light mode, Inter font, 4px grid.
skills/clerk/ on GitHub (opens in a new tab)SKILL.md -
coda-ui-skills
Coda's UI design system. Use when building interfaces inspired by Coda's aesthetic - light mode, Inter font, 4px grid.
skills/coda/ on GitHub (opens in a new tab)SKILL.md -
codeium-ui-skills
Codeium's UI design system. Use when building interfaces inspired by Codeium's aesthetic - dark mode, Inter font, 4px grid.
skills/codeium/ on GitHub (opens in a new tab)SKILL.md -
convertkit-ui-skills
Convertkit's UI design system. Use when building interfaces inspired by Convertkit's aesthetic - light mode, Inter font, 4px grid.
skills/convertkit/ on GitHub (opens in a new tab)SKILL.md -
convex-ui-skills
Convex's UI design system. Use when building interfaces inspired by Convex's aesthetic - dark mode, Inter font, 4px grid.
skills/convex/ on GitHub (opens in a new tab)SKILL.md -
copy-ai-ui-skills
Copy Ai's UI design system. Use when building interfaces inspired by Copy Ai's aesthetic - light mode, Inter font, 4px grid.
skills/copy-ai/ on GitHub (opens in a new tab)SKILL.md -
craft-ui-skills
Craft's UI design system. Use when building interfaces inspired by Craft's aesthetic - light mode, Inter font, 4px grid.
skills/craft/ on GitHub (opens in a new tab)SKILL.md -
deel-ui-skills
Deel's UI design system. Use when building interfaces inspired by Deel's aesthetic - light mode, Inter font, 4px grid.
skills/deel/ on GitHub (opens in a new tab)SKILL.md -
descript-ui-skills
Descript's UI design system. Use when building interfaces inspired by Descript's aesthetic - dark mode, Inter font, 4px grid.
skills/descript/ on GitHub (opens in a new tab)SKILL.md -
discord-ui-skills
Discord's UI design system. Use when building interfaces inspired by Discord's aesthetic - light mode, Inter font, 4px grid.
skills/discord/ on GitHub (opens in a new tab)SKILL.md -
dribbble-ui-skills
Dribbble's UI design system. Use when building interfaces inspired by Dribbble's aesthetic - light mode, Inter font, 4px grid.
skills/dribbble/ on GitHub (opens in a new tab)SKILL.md -
figma-ui-skills
Figma's UI design system. Use when building interfaces inspired by Figma's aesthetic - light mode, Inter font, 4px grid.
skills/figma/ on GitHub (opens in a new tab)SKILL.md -
framer-ui-skills
Framer's UI design system. Use when building interfaces inspired by Framer's aesthetic - dark mode, Inter font, 4px grid.
skills/framer/ on GitHub (opens in a new tab)SKILL.md -
front-ui-skills
Front's UI design system. Use when building interfaces inspired by Front's aesthetic - light mode, Inter font, 4px grid.
skills/front/ on GitHub (opens in a new tab)SKILL.md -
ghost-ui-skills
Ghost's UI design system. Use when building interfaces inspired by Ghost's aesthetic - dark mode, Inter font, 4px grid.
skills/ghost/ on GitHub (opens in a new tab)SKILL.md -
github-ui-skills
GitHub's UI design system. Use when building interfaces inspired by GitHub's aesthetic - dark mode, Inter font, 4px grid.
skills/github/ on GitHub (opens in a new tab)SKILL.md -
gumroad-ui-skills
Gumroad's UI design system. Use when building interfaces inspired by Gumroad's aesthetic - dark mode, Inter font, 4px grid.
skills/gumroad/ on GitHub (opens in a new tab)SKILL.md -
gusto-ui-skills
Gusto's UI design system. Use when building interfaces inspired by Gusto's aesthetic - light mode, Inter font, 4px grid.
skills/gusto/ 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.