ui-design-mode-picker

Guides the agent through a two-track visual styling workflow for web interfaces. Track one is a restrained production style built from utility classes and conventional components, suited to app screens such as dashboards, forms and settings. Track two is a showcase style using frosted-glass surfaces, layered gradients, curated color tokens and small motion details, suited to landing and marketing pages. Covers mode selection criteria, adaptable CSS and Tailwind recipes, palette token sets, and guardrails for responsiveness, dark mode and readable contrast. Use when the user asks to design, build or restyle web screens or components, or asks for a premium, glassy or animated look. Not for backend logic, non-web toolkits, project scaffolding or build bundling.

Version

v1.0.0

Size

11 KB

Updated

2026-10-10

Your client verifies the signature before reading. This explicit manual read is available on every plan. Free automatically loads five chosen skills; paid plans automatically load relevant skills across the library.