design-system
starsforks
How to install design-system?
archive228/loopkit/design-system
$npx -y skills add Archive228/loopkit --skill design-systemMake frontend output look intentional, not AI-generated. Use for any UI work — components, pages, layouts.
SKILL.md
| 1 | # Design System |
| 2 | Default AI UI is gray, centered, and timid. Don't ship that. |
| 3 | - **Type** — one distinctive display face + one clean body face. Real scale (e.g. 12/14/16/20/28/40), not everything 16px. |
| 4 | - **Color** — one strong accent, a real neutral ramp, intentional contrast. No 5 competing brand colors. |
| 5 | - **Space** — a spacing scale (4/8/12/16/24/32...). Generous whitespace. Align to a grid. |
| 6 | - **Motion** — purposeful only: feedback on action, transitions on state. No decorative bounce. |
| 7 | - **Hierarchy** — one clear focal point per screen. Size, weight, and space do the work, not borders everywhere. |
| 8 | Before done: would a senior designer ship this, or does it look like a default Tailwind template? If the latter, push the contrast and the type. |
People who liked this also viewed
6 picksType
- entra-app-registrationGuides Microsoft Entra ID app registration, OAuth 2.0 authentication, and MSAL integration. USE FOR: create app registration, register Azure AD app, configure OAuth, set up authentication, add API perSkillsJul 2026
- azure-complianceRun Azure compliance and security audits with azqr plus Key Vault expiration checks. Covers best-practice assessment, resource review, policy/compliance validation, and security posture checks. WHEN: SkillsJul 2026
- azure-rbacOfficial agent plugin providing skills and MCP server configurations for Azure scenarios.SkillsJul 2026
- better-auth-best-practicesAgent skill from better-auth/skillsSkillsJul 2026
- firebase-security-rules-auditorA skill to evaluate how secure Firestore security rules are. Use this when Firestore security rules are updated to ensure that the generated rules are extremely secure and robust.SkillsJul 2026
- audit-websiteAudit a website with the squirrelscan CLI and fix the findings in code. Runs SEO, performance, security, technical, content, accessibility, and 15 other rule categories (260+ rules), returns an LLM-opSkillsJul 2026
