Development
Plugin
ui-skills
Skills for Design Engineers More on ui-skills.com Run npx ui-skills start to route your agent through the right UI skill set for the task.
Plugin Signal68/100Solid
maintained100
capable43
documented40
adopted82
Install
$ npx -y skills add ibelick/ui-skills --agent claude-code
Run the curl in your terminal, the rest in Claude Code.
Stats
7,122
Stars
309
Forks
Active
Maintenance
TypeScript
Language
MIT
License
19h ago
Last commit
7mo ago
Created
Repo: ibelick/ui-skills
What's inside
Skills
7/baseline-uiQuickly deslop UI code by fixing spacing, hierarchy, typography, and small layout issues. Use when the interface needs a fast cleanup or polish pass./create-design-mdCreate or update a DESIGN.md from an existing product repository or public website. Use when asked to document an interface's design language, reconstruct its visual system, extract design tokens and guidance from current evidence, or give coding agents persistent UI context. Do/fixing-accessibilityAudit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance./fixing-metadataAudit and fix HTML metadata including page titles, meta descriptions, canonical URLs, Open Graph tags, Twitter cards, favicons, JSON-LD structured data, and robots directives. Use when adding SEO metadata, fixing social share previews, reviewing Open Graph tags, setting up/fixing-motion-performanceAudit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance./improve-uiAudit an existing product surface against its own design evidence, identify verified UI problems, and write self-contained implementation plans for another agent. Strictly read-only on product source. Use when asked to review, refine, improve, or clean up an interface without
README
1UI Skills
Skills for Design Engineers
More on ui-skills.com
Run npx ui-skills start to route your agent through the right UI skill set for the task.
CLI
npx ui-skills
npx ui-skills start
npx ui-skills categories
npx ui-skills list --category motion
npx ui-skills get baseline-ui
License
Licensed under the MIT license.
File tree
113ibelick/ui-skillsView on GitHub
.github/
workflows/
release.yml
.gitignore
.prettierignore
.prettierrc.json
.vscode/
extensions.json
launch.json
AGENTS.md
astro.config.mjs
bin/
ui-skills
ui-skills.js
ui-skills.ts
DESIGN.md
LICENSE
package-lock.json
package.json
public/
favicon.svg
UI-OG-X.png
UI-OG-X.webp
UI-OG.png
UI-OG.webp
README.md
scripts/
precompute-agent-skills-digests.mjs
write-assetsignore.mjs
skills/
baseline-ui/
SKILL.md
create-design-md/
SKILL.md
fixing-accessibility/
SKILL.md
fixing-metadata/
SKILL.md
fixing-motion-performance/
SKILL.md
improve-ui/
agents/
openai.yaml
references/
plan-template.md
SKILL.md
ui-skills-root/
SKILL.md
src/
data/
agent-skills-digests.json
agents.ts
registry.ts
skills.ts
topics.ts
layouts/
Layout.astro
lib/
agent-discovery.ts
agent-skills-discovery.ts
format-stars.ts
github-stars.ts
markdown-negotiation.ts
oauth-discovery.ts
remote-skill.ts
render-skill-markdown.ts
serialize-json-ld.ts
skill-catalog.ts
webmcp-tools.ts
middleware.ts
pages/
.well-known/
agent-skills/
[skill]/
SKILL.md.ts
index.json.ts
api-catalog.ts
jwks.json.ts
mcp/
server-card.json.ts
oauth-authorization-server.ts
oauth-protected-resource.ts
openid-configuration.ts
404.astro
agent/
[id].astro
index.astro
agents/
[id].astro
index.astro
api/
github-stars.ts
auth.md.ts
design.md.ts
index.astro
llms.txt.ts
mcp.ts
oauth/
authorize.ts
claim.ts
register.ts
revoke.ts
token.ts
userinfo.ts
robots.txt.ts
sitemap.xml.ts
skills/
[...slug]/
[...slug].astro
llms.txt.ts
index.astro
registry.json.ts
registry.txt.ts
topics.astro
styles/
global.css
ui/
agent-start-here.astro
breadcrumbs.astro
button.astro
code-block.astro
command-dialog.tsx
copy-button.tsx
expandable-code-block.astro
footer.astro
github-star-button.astro
keyboard-shortcut.tsx
newsletter-input.tsx
skill-card.astro
skill-content-card.astro
skill-nav.astro
text-morph.tsx
tooltip.tsx
topic-tag.astro
webmcp-tools.tsx
tests/
agent-discovery.test.ts
cli.test.ts
external.test.ts
markdown-negotiation.test.ts
oauth-discovery.test.ts
routes.test.ts
skills-mcp-discovery.test.ts
smoke.mjs
webmcp-tools.test.ts
tsconfig.json
wrangler.jsoncFAQ
ui-skills is a Claude Code plugin with 7 hand-picked skills for development work, indexed on Flowy. Install it with the command on its page. It includes baseline-ui, create-design-md, fixing-accessibility. Its skills do not fire on their own yet. Request auto-invocation to have Flowy route them as you prompt. Free and open source.
- What is ui-skills?
- Skills for Design Engineers More on ui-skills.com Run npx ui-skills start to route your agent through the right UI skill set for the task.
- How do I install ui-skills?
- Run these in Claude Code: npx -y skills add ibelick/ui-skills --agent claude-code. Then prompt normally.
- Does ui-skills auto-invoke its skills?
- Not yet. It is indexed on Flowy as a plain plugin. Request auto-invocation on its page and Flowy will route its skills for you as you prompt.
- Is ui-skills free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.