Loading...
Loading...
Found 15 Skills
Use when the user wants to design a mobile app, create screens, build UI, or interact with their Sleek projects — whether high-level ("design an app that does X") or specific ("list my projects", "create a new project", "screenshot that screen").
Build a throwaway prototype to flush out a design before committing to it. Routes between two branches — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route. Use when the user wants to prototype, sanity-check a data model or state machine, mock up a UI, explore design options, or says "prototype this", "let me play with it", "try a few designs".
General-purpose desktop web prototype. Single self-contained HTML file built by copying the seed `assets/template.html` and pasting section layouts from `references/layouts.md`. Default for any landing / marketing / docs / SaaS page when no more specific skill matches.
Create polished design artifacts as self-contained HTML — UI mockups, interactive prototypes, wireframes, landing pages, dashboards, app screens, mobile apps, and slide decks. Use this skill whenever the user wants to design, mock up, prototype, wireframe, or visualize any interface, screen, flow, or visual artifact — even when they don't say the word "design" (e.g. "build me a landing page", "show me what a settings screen could look like", "prototype an onboarding flow", "wireframe a few layout ideas", "make a pitch deck"). It drives a full design process: clarifying questions, design-context gathering, and production of one or more HTML deliverables. Runs on portable agent harnesses including Claude Code, Cursor, and Codex Agent — harness-specific tools are resolved from references/.
Professional UI design and frontend interface guidelines. Use this skill when creating web pages, mini-program interfaces, prototypes, or any frontend UI components that require distinctive, production-grade design with exceptional aesthetic quality.
This skill generates text-based UI wireframes using .kui file syntax. Use when creating wireframes, mockups, or UI layout diagrams. The skill converts .kui files to SVG/PNG images via the katsuragi CLI tool.
Use when you need to ship a single PR-sized feature end-to-end (plan -> implement -> verify) with artifacts. Ship core product features quickly in a Next.js codebase: turn a feature idea into an executable plan, implement in PR-sized slices, and keep artifacts under runs/ (or OpenSpec changes/ when available). Supports plan-only mode for early scoping. For prototype UI work, include a demo-ready wow moment (animation/micro-interaction) by default unless user opts out.
Create distinctive, production-grade frontend interfaces. Always generates 3 wildly different worldclass proposals with UX architecture. Use when building web components, pages, dashboards, or applications. Generates creative, polished code that avoids generic AI aesthetics.
Design user-centric interfaces for web applications. Creates wireframes, visual designs, and interactive prototypes with usability focus.
DESIGN-CATALOG
Prototype Design Skill
Sketch a UI design as a throwaway `.openui` file in `docs/prototype/` for the developer to render live in the Genui VS Code extension. Use when the user wants to see a design, sketch a screen, mock up a layout, compare a few options, or says "genui this", "sketch a [page]", "mock up [thing]", "let me see a few options", "prototype this design", "draft a UI". This is specifically for visual UI mockups rendered by the Genui extension, not terminal logic prototyping.