Pulls frameworks from product leaders at Figma and Airbnb to help you decide if you need a design system and how to build one people will actually use. Covers the fundamentals like separating concept from production with low-fidelity wireframes, designing assets that teach their own usage, and avoiding the trap of over-engineering something only expert designers can navigate. The guidance skews practical: it'll push you to assess adoption strategy before you build, flag if you're too early stage for this investment, and help scope whether you need tokens, components, or full documentation. Best when you're scaling a product team and inconsistency is becoming expensive.

skills.sh installs
1.8K
GitHub stars
1.5K
last updated
Aug 21, 2026

Install

$ npx -y skills add refoundai/lenny-skills --skill design-systems --agent claude-code

Installs into .claude/skills of the current project.

Files

Pulls frameworks from product leaders at Figma and Airbnb to help you decide if you need a design system and how to build one people will actually use. Covers the fundamentals like separating concept from production with low-fidelity wireframes, designing assets that teach their own usage, and avoiding the trap of over-engineering something only expert designers can navigate. The guidance skews practical: it'll push you to assess adoption strategy before you build, flag if you're too early stage for this investment, and help scope whether you need tokens, components, or full documentation. Best when you're scaling a product team and inconsistency is becoming expensive.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/refoundai/lenny-skills
Categories
Frontend Development, DevOps & CI/CD, Marketing & SEO, Design & UI/UX

More from refoundai/lenny-skills

All 86
1nvidia avatarmcore-testingnvidia/skillsTest system for Megatron-LM. Covers test layout, recipe YAML structure, adding and running unit and functional tests, golden values, marker filters, and CI pari1.8Kskills.sh installs
2pproenca avatartypescriptpproenca/dot-skillsTypeScript performance, tsconfig, type errors, async patterns — triggered when the user asks to "optimize TypeScript performance", "speed up tsc compilation", "1.8Kskills.sh installs
3dylantarre avatarframer-motiondylantarre/animation-principlesUse when implementing Disney's 12 animation principles with Framer Motion in React applications1.8Kskills.sh installs
4k-dense-ai avatarxlsxk-dense-ai/scientific-agent-skillsCreate, edit, analyze, or convert Excel spreadsheets (.xlsx, .xlsm, .xltx) where the workbook file is the primary deliverable. Use for formulas, formatting, fin1.8Kskills.sh installs
5jezweb avatarvitestjezweb/claude-skillsSet up Vitest testing in any project — detects type (Cloudflare Workers, React, Node, library), generates vitest.config.ts, test setup, utilities, and a sample 1.8Kskills.sh installs
6ar9av avatarwiki-dedupar9av/obsidian-wikiScan the Obsidian wiki for page-level identity collisions — different pages covering the same concept under different names (e.g. "RSC" vs "React Server Compone1.8Kskills.sh installs