An open collection of reusable design systems and agent-ready skills. Browse the Design Skill Library.
Start with Design Taste for judgement about hierarchy, composition, content, and interaction. Choose a system when you want a concrete visual direction. System names describe their qualities and purpose; they are not named after companies or endorsements.
| Area | Systems |
|---|---|
| Business Apps | Precision Console, Quiet Workspace, Operational Ledger |
| Landing Pages | Editorial Calm, Bold Launch, Gallery Focus |
| Mobile Apps | Pocket Utility, Social Canvas, Field Companion |
| Slide Decks | Narrative Pitch, Evidence Brief, Workshop Canvas |
| Commerce | Warm Commerce |
| Editorial | Longform Journal |
Each folder includes a complete SKILL.md, reusable tokens.css, a local preview.html specimen, full-size PNG and optimized WebP previews, metadata, and optional agent display metadata. The core skill also includes a selection reference. No application backend or paid account is required to inspect the files.
Download an individual ZIP or the full library from the latest release. Extract it, inspect the instructions, and add the selected skill folder to your coding agent’s supported skill location, or provide the folder in your workspace. Keep referenced files beside SKILL.md. Installation paths and discovery behavior differ between agents.
Ask the agent to use the selected skill for a concrete task. Preserve your project’s existing behavior and design requirements. tokens.css is a starting vocabulary to map into the project’s own theme. For slide decks, apply the typography and composition guidance using editable elements in the destination format.
The previews contain fictional sample content and demonstrate composition and component states. They do not claim to be complete applications or implemented integrations.
Contributors work in this public repository; access to the hosting platform’s private codebase is not required. Follow CONTRIBUTING.md to submit a skill, improve a system, or propose another category. Maintainers review the source, preview, accessibility, and attribution before publishing. A contributor cannot grant their own verified badge through skill metadata.
Python 3.10+ is enough to validate and package:
python3 scripts/build.py --check
python3 -m unittest discover -s tests
python3 scripts/build.py
python3 -m http.server 4190Open skills/<slug>/preview.html. Every preview uses local CSS, bundled fonts with their OFL licenses, and sample content. Image-led systems include original generated photographs and an asset provenance note. Each system has a distinct composition, type hierarchy, density, and control language; the systems are not palette swaps. To regenerate thumbnails, install the optional preview tooling with npm ci, run npx playwright install chromium, then npm run capture while the server is running. Captures use a 1280×800 viewport at 1.5× density for full-size PNGs and produce 1280-pixel-wide WebP thumbnails for browsing.
Pull requests validate and produce a downloadable review artifact. Approved changes merged to main publish commit-addressed ZIPs and a catalog as a GitHub Release. The website reads the latest published catalog; preview images and downloads point to the same immutable revision. Failed validation does not publish. Categories are data, so adding an approved category does not require redesigning the website.
Original skills, tokens, and preview source are MIT licensed. Include provenance and compatible licenses for any new third-party assets. Never contribute private data, credentials, proprietary source, or a copied company identity.