Comprehensive design guide for web and mobile applications. Contains 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types. Use when the user requests UI/UX work (design, build, create, implement, review, fix, improve).
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# ui-ux-pro-max
Comprehensive design guide for web and mobile applications. Contains 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 technology stacks. Searchable database with priority-based recommendations.
## Prerequisites
Check if Python is installed:
```bash
python3 --version || python --version
```
If Python is not installed, install it based on user's OS:
**macOS:**
```bash
brew install python3
```
**Ubuntu/Debian:**
```bash
sudo apt update && sudo apt install python3
```
**Windows:**
```powershell
winget install Python.Python.3.12
```
---
## How to Use This Workflow
When user requests UI/UX work (design, build, create, implement, review, fix, improve), follow this workflow:
### Step 1: Analyze User Requirements
Extract key information from user request:
- **Product type**: SaaS, e-commerce, portfolio, dashboard, landing page, etc.
- **Style keywords**: minimal, playful, professional, elegant, dark mode, etc.
- **Industry**: healthcare, fintech, gaming, education, etc.
- **Stack**: React, Vue, Next.js, or default to `html-tailwind`
### Step 2: Generate Design System (REQUIRED)
…
The line at the top of this page pins the label git:20260820.4dbe9e4, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
GET https://markdownregistry.com/api/v1/artifacts/art_fkuviiqol3yezy5b
GET https://markdownregistry.com/api/v1/resolve?ref=j-star-films-studios/vibecode-protocol-suite/ui-ux-pro-max
GET https://markdownregistry.com/api/v1/blob/730918d12b9db52c2c0e93904c8cbd89284bbc98b1b5d1e351cbfa142477c55b
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
j-star-films-studios/vibecode-protocol-suite · .agents/skill-curator/SKILL.md · Use when adding, importing, reorganizing, renaming, or refactoring skills according to the Lean Unified Skills…
j-star-films-studios/vibecode-protocol-suite · .agents/skills/unslop/SKILL.md · Use when writing any text, chat responses, documentation, UI copy, or skill instructions. Cuts AI tells, filler, and…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/arena/SKILL.md · Spawn N parallel candidates at the same task, pick a base, graft the strongest parts of the losers into it. Use for…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/automate-me/SKILL.md · Use for "automate me", "create/update/refresh my -mode skill", "turn/capture my preferences or working style into a…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/codex-control/SKILL.md · Use when Pi needs to delegate browser, desktop, or native-plugin tasks to the installed Codex CLI.
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/conversation-to-spec/SKILL.md · Turn the current conversation into a spec and publish it to the project issue tracker: no interview, just synthesis of…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/crafting-effective-readmes/SKILL.md · Use when writing or improving README files. Not all READMEs are the same — provides templates and guidance matched to…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/create-verification-skill/SKILL.md · Generate a project-local verification skill that drives your app the way a user does — any language, framework, or…
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/domain-modeling/SKILL.md · Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a CONTEXT.md…
awesome-dsh-plugin/awesome-dsh-plugin · .agents/skills/ui-ux-pro-max/SKILL.md · UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing…
coco-research/coco · skills/ui-ux-pro-max/SKILL.md · Use when designing, building or reviewing UI/UX for a web or mobile app: picking styles, color palettes, typography…
kunolu/640-skills · sbtd-workflow-onboard/assets/external-skills/stable/skills/ui-ux-pro-max/SKILL.md · UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing…
julianromli/ai-skills · skills/ui-ux-pro-max/SKILL.md · UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product…
roedyrustam/vibes-plug · skills/ui-ux-pro-max/SKILL.md · Comprehensive design guide & BM25 search engine for web and mobile applications across 11 tech stacks / Panduan desain…
