design-resources-for-developers
Use when selecting design and UI resources for frontend work, including UI graphics, fonts, color tools, icons, logos, favicons, stock photos, videos, sound effects, vectors, mockups, HTML/CSS templates, CSS frameworks, animation/chart libraries, UI kits, React/Vue/Angular/Svelte/React Native UI libraries, design systems, design tools, inspiration, compression tools, browser extensions, and AI graphic design tools. This is a locally integrated mirror of bradtraversy/design-resources-for-developers.
Source facts
- Repository
- onfire7777/universal-ai-skills-library
- Last source activity
- May 14, 2026 at 01:59
- Detected SKILL.md language
- English
- Stars
- 16
- Forks
- 0
Install options
The review-first prompt is selected by default. You can switch to a direct command or download a local copy.
Review the source files
Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.
File Explorer
9 filesShowing SKILL.md
SKILL.md
Source instructions · Read-only preview- name
- design-resources-for-developers
- description
- Use when selecting design and UI resources for frontend work, including UI graphics, fonts, color tools, icons, logos, favicons, stock photos, videos, sound effects, vectors, mockups, HTML/CSS templates, CSS frameworks, animation/chart libraries, UI kits, React/Vue/Angular/Svelte/React Native UI libraries, design systems, design tools, inspiration, compression tools, browser extensions, and AI graphic design tools. This is a locally integrated mirror of bradtraversy/design-resources-for-developers.
- license
- MIT
# Design Resources for Developers
Use this skill to find practical design resources before building, redesigning, or polishing frontend interfaces. Prefer it when the task needs third-party resource discovery, asset sourcing, design-tool suggestions, UI-library comparison, or inspiration links.
## Source
- Upstream repository: `https://github.com/bradtraversy/design-resources-for-developers`
- Integrated source commit: `6d9884e7260076e0eced4ac9f3be7665a91a9476`
- Local source checkout: `%USERPROFILE%\.design-resources-for-developers\design-resources-for-developers`
## Workflow
1. Start with `references/category-index.md` to choose the relevant category.
2. Use `scripts/search_design_resources.py` for targeted lookup without loading the full README.
3. Load `references/catalog.md` only when category-level detail is needed.
4. Load `references/source-readme.md` when the exact upstream wording or full list matters.
5. Check `references/contributing.md` before proposing additions back to the upstream list.
## Search Helper
Run from this skill directory:
```bash
python scripts/search_design_resources.py --query "tailwind" --limit 10 --format md
python scripts/search_design_resources.py --category "React UI Libraries" --limit 20 --format md
python scripts/search_design_resources.py --query "color contrast" --format json
```
The helper searches resource names, descriptions, URLs, and categories in `references/resources.json`.
## Use Rules
- Recommend resources by category and use case, not as a flat link dump.
- Prefer official, actively maintained, accessible, and production-friendly tools when the user is making implementation choices.
- Treat the mirrored catalogue as a starting point. If freshness matters, verify the resource live before relying on availability, pricing, license, or maintenance status.
- Do not paste the full catalogue into the answer. Cite only the relevant few resources and mention the category used.
- Keep licensing separate from availability: the upstream list focuses on free resources, but individual resources may have their own terms.
View on GitHub