interface-design: a Claude Code skill by Oyindamola Akinleye
For builders of dashboards, admin panels and SaaS tools who want each visual choice argued from the product's world. Skip it for landing pages or marketing sites.
- Score
- 64of 100
- Rank
- #214of 239
- Installs
- 33Kon skills.sh
- Security
- Clear 5 scanners
- Updated
- 2026
- Context
- ~101tokens always
Install
npx skills add https://github.com/dammyjay93/interface-design --skill interface-design
Run it in your terminal. View the source
Using the Claude app rather than Claude Code? You can add a skill there too. How to add it in the app
What does interface-design do?
interface-design is a skill that guides Claude through designing product interfaces such as dashboards, settings pages and data tools. Before code it names the person, their task and the intended feel, then lists the product's domain concepts, its natural colors, one signature element and three defaults to reject, and asks if the direction fits. Each component starts with a short statement of hierarchy, palette, depth, surfaces, type and spacing. It prefers native HTML, then headless primitives, then your existing design system and tokens. Swap, squint, signature and token tests run before showing work, and it offers to save decisions in .interface-design/system.md.
When should you use interface-design?
Use it when
- Your dashboard looks like every generated template
- You want a design direction proposed before any code
- You want spacing and color decisions saved for later sessions
Skip it when
- You are building a landing page or campaign
- You want a quick fix without design reasoning
What it needs and what it can touch
What it can do
- Reads and edits project UI files
- Runs your build, typecheck or tests when available
- Writes .interface-design/system.md if you agree
From reading its instructions, not from running it.
Why it scores 64
Strongest on quality (100 of 100), weakest on adoption (51).
Is interface-design safe to install?
Every scanner that checked it passed it. Scanners often miss what other scanners catch, and a skill can change after a scan. Read its source before you install it.
| Scanner | Result | Date |
|---|---|---|
| Gen Agent Trust Hub | Passed | Sep 15, 2026 |
| Socket | Passed | Sep 15, 2026 |
| Snyk | Low risk | Sep 15, 2026 |
| Runlayer | Low risk | Feb 26, 2026 |
| ZeroLeaks | Low risk | Apr 15, 2026 |
Details
- Installs
- 33,002
- Repository stars
- 5,951
- Last repository change
- Tokens always loaded
- about 101
- Tokens when used
- about 7,217
- License
- MIT
- Data confidence
- High
Did it do the job for you?
Alternatives to interface-design
All skills for this job-
Get ui-ux-pro-maxui-ux-pro-max
For builders who want Claude to pick styles, palettes and fonts from a local search database before writing UI.
-
Get AI Design SkillsAI Design Skills
For people building a landing page or Figma file who want fixed design rules and conversion structure.
-
Get design-taste-frontenddesign-taste-frontend
For people building landing pages or app screens who want a chosen art direction, checked in a real browser.
-
Get frontend-designfrontend-design
For anyone asking Claude to build a page or screen whose look should be chosen for the subject.
interface-design