Web design
4 skillsThe 11ai visual language, deliberate content-led styling, and repository-driven project sites for accessible, compact, and data-rich interfaces.
View this plugin on GitHub$ npx skills add rj11io/11ai --skill 11ai-design-styleguides --skill 11ai-modern-clean-ui --skill 11ai-pimp-my-ui --skill 11ai-www$ claude plugin install 11ai-web-design@11ai$ codex plugin add 11ai-web-design@11aiFirst time? Add the marketplace once with claude plugin marketplace add rj11io/11ai or codex plugin marketplace add rj11io/11ai, then install any plugin from it.
Apply the visual and interaction language of v0/www to new or existing web interfaces: neutral semantic color tokens, Inter/mono typography, type-led hierarchy, restrained shadcn components, compact analytical variants, accessible responsive layouts, and honest data visualization. Use when designing, restyling, reviewing, or implementing a website, dashboard, catalog, report, benchmark UI, or data-heavy frontend that should look and behave like 11ai.
Build or restyle a web interface toward the contemporary 'modern clean' look used by products like Linear, Vercel, and shadcn/ui: neutral surfaces with one accent color, generous whitespace, clear type hierarchy, soft borders and shadows instead of heavy chrome, and restrained motion. Framework-agnostic principles with concrete Tailwind/shadcn guidance. Use when the user asks for a UI that looks modern, clean, minimal, polished, or professional; wants a design system or styleguide for a new app; says a page looks '90s', cluttered, generic, or like a template; or is starting a new product's frontend and wants it to look and feel high quality from the first screen.
Take an application's user-facing content, reach one deliberate style and design decision for it, and execute that design end to end — using the tools already in the codebase first (framework, CSS system, component library, theme tokens, fonts), installing at most one or two small critical packages when something essential is missing. Use when the user asks to style, restyle, polish, or "pimp" a UI, make an app or page look designed instead of default, pick a visual direction for existing content, or upgrade a working-but-plain interface — standalone, with no other skill required.
Examine a project, decide what its public site should display, choose a design direction, and build an elegant frontend that presents the project — either in a dedicated www/ folder or embedded in an existing app. The site treats the repository as its single source of truth: real project files are scanned at build time, so content, counts, and catalog pages update automatically when the project changes. Use when the user asks for a project site, a landing page for a repo, a catalog or docs browser over repository content, "build a www for this", or "display the concept of the project" — and follow through from content inventory to a verified, statically generated build.