Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add alebgl77/claude-inc --skill ui-ux-pro-maxgit clone --depth 1 https://github.com/alebgl77/claude-incWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/alebgl77/claude-inc/ui-ux-pro-max)<a href="https://agentmods.dev/skills/alebgl77/claude-inc/ui-ux-pro-max"><img src="https://agentmods.dev/badge/skills/alebgl77/claude-inc/ui-ux-pro-max/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/alebgl77/claude-inc/ui-ux-pro-max"><img src="https://agentmods.dev/badge/skills/alebgl77/claude-inc/ui-ux-pro-max.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00102 | $0.01299 |
| Opus 5 | $0.00051 | $0.00649 |
| Sonnet 5 | $0.00020 | $0.00260 |
| Haiku 4.5 | $0.00010 | $0.00130 |
Grade A, and why
ui-ux-pro-max scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 9d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 96 lines — stays where its author put it; the contents beside it link to each section on GitHub.
UI UX Pro Max — Design Lead
"Full UI/UX system"
When to use
- A product is about to be built or rebuilt and needs its foundation first — "set up the design system for our app".
- Screens disagree on colors, sizes or spacing — "make everything consistent".
- Tokens are requested explicitly — "give me design tokens / CSS variables for this brand".
- A component library is planned — "spec our buttons, inputs and cards with all their states".
- Downstream skills (
frontend-design,web-artifacts) need a system to consume.
Workflow
- Interrogate the product. Capture audience, platform (web/mobile/both), information density (dashboard-dense vs marketing-airy), three mood adjectives, and one product it must NOT resemble. If a BRAND.md exists, inherit its palette and type — never invent parallel ones.
- Build the color system. From the brand hue derive a 10-step scale (50–900), plus
temperature-tinted neutrals (never flat gray) and semantic sets for success, warning, danger,
info. Then map role tokens onto steps:
--color-surface,--color-text,--color-accent. - Set the type scale. Two families max (display + text). Pick a modular ratio — 1.2 for dense products, 1.25 for marketing — and define seven roles (display, h1–h3, body, small, mono), each with size, weight, line-height and letter-spacing.
- Define space, radius, elevation. Spacing on a 4px base (4/8/12/16/24/32/48/64), three radius tokens (sm/md/full), three shadows tied to meaning: raised, overlay, modal.
- Inventory components. List every component the product needs. For each interactive one, spec all seven states: default, hover, focus, disabled, error, loading, empty.
- Fix the layout grid. 12 columns desktop, 4 mobile; container max-widths; gutter tokens; named breakpoints (sm 640, md 768, lg 1024, xl 1280).
- Run the contrast pass. Every text/background pair must hit WCAG AA — 4.5:1 body, 3:1 large text and UI borders. Repair failures by shifting scale steps, never by one-off hex tweaks.
- Emit deliverables. Write
tokens.cssandCOMPONENTS.md. No token may exist in one file and not the other.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 9d ago First seen · 96 lines · 102 tokens per session scan A 784ac1b5d449
ui-ux-pro-max is a skill published in the GitHub repository alebgl77/claude-inc (14 stars, last pushed today), licensed MIT. It adds 102 tokens to every session and 1,299 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
design-preview
A method for turning an existing or proposed interface into a self-contained HTML preview that can be opened and checked in Chrome.
keyboard
Load this skill for every project containing interactive UI elements — buttons, links, modals, dropdowns, sliders, tabs, carousels, or any custom widget. Under no circumstances create an interactive component that cannot be fully operated by keyboard alone. Absolutely always ensure visible focus indicators, logical…
light-dark-mode
Load this skill whenever the project supports light/dark mode, colour theme switching, high-contrast mode, or responds to prefers-color-scheme. Under no circumstances hard-code colours that break in alternative themes. Absolutely always test colour contrast in both light and dark themes, and respect user OS-level…
svg
Load this skill whenever the project contains SVG graphics — inline SVGs, external SVG files, SVG icons, SVG illustrations, or SVG-based data visualizations. Under no circumstances use SVG without proper accessible titles, descriptions, and ARIA roles where required. Absolutely always add and to meaningful SVGs and…
touch-pointer
Load this skill whenever the project contains interactive UI elements that users touch, tap, click, drag, swipe, or gesture with — buttons, links, drag-and-drop interfaces, sliders, carousels, or custom touch interactions. Under no circumstances create touch targets smaller than 44×44 CSS pixels. Absolutely always…
aria-live-regions
Load this skill whenever the project contains dynamic content updates, status messages, alerts, notifications, loading indicators, or any use of aria-live, role="status", role="alert", or role="log". Under no circumstances add or modify live-region markup without applying these rules. Prioritize correct politeness…