Generates high-quality images, logos, artwork, and avatars directly through the internal LLM gateway using gpt-image-2.
INVOKE THIS SKILL when: making AI-generated images interactive, mapping clickable zones onto generated artwork, warping HTML content onto…
Create logos using AI image generation. Discuss style/ratio, generate variations, iterate with user feedback, crop, remove background, and…
Automate Logo Dev tasks via Rube MCP (Composio).
Generates low-fidelity grayscale wireframes and multi-screen storyboards to rapidly explore and compare structural UX directions before…
Creates animated GIFs optimized for Slack including emoji animations and message GIFs with proper sizing and frame rates.
Creates web assets including favicons, app icons, Open Graph images, social media cards, and other web graphics from source images or…
Create a minimal working Lucidchart example.
Local Dev Loop for Lucidchart.
Rate Limits for Lucidchart.
Design and build native-feeling macOS application UIs.
Establish, inspect, or evolve a project's reusable design-system foundations, semantic tokens, themes, component inventory, variants, and…
Master microinteractions, animations, transitions, and feedback systems.
Extract design systems from reference UI images and generate implementation-ready UI design prompts.
Use when creating elaborate, multi-component claude.ai HTML artifacts with React, Tailwind CSS, shadcn/ui, state management, routing, or…
Add small, clear motion to an approved brand raster and deliver layers, loops, or first and last frames.
Turn a method, sequence, maturity model, or grouped idea into a small family of separate brand assets.
Make one integrated brand scene with several visual parts and deliberate room for copy.
Apply concrete design-engineering details that make interfaces feel polished.
Make or reuse one brand-matched raster asset with one clear meaning.
Adds collapsible floating parameter panels to single-file HTML prototypes for live real-time adjustments of colors, typography, layout…