Design
UI/UX direction, visual design, and design systems
design-system
by kenneth-liao
Use when users want to create, update, or refresh a visual design system or art style guide. Produces a complete style guide document with color palette, typography, illustration rules, character system, and an 8-element style board generated via the art:nanobanana skill.
thumbnail
by kenneth-liao
Create high-performing thumbnails and cover images for any platform. Uses art:nanobanana for generation, follows proven design patterns for CTR optimization, and integrates with brand guidelines for consistency.
brand-guidelines
by kenneth-liao
Use when users want to define, codify, or update their brand identity and connect it to design systems. Produces a self-contained user-level skill at ~/.claude/skills/{brand-slug}/SKILL.md that enforces brand guidelines whenever visual assets or written content are created.
social-graphic
by kenneth-liao
"Create social media graphics and visual assets for any platform. Handles platform-specific dimensions, safe zones, and design constraints. Integrates with art:nanobanana for image generation and brand guidelines for consistency."
iran-israel-alerts
by magen-yehuda-intel
Monitor Iran-Israel-US military escalation and attack alerts using 85+ OSINT sources, satellite fire detection, seismic monitoring, cyber warfare tracking, military flight tracking, and real-time alert APIs. Includes interactive Leaflet strikes dashboard with 49K+ geolocated events, live feed pipeline, US/Iran military base overlays, PWA mobile support, and event type filtering. Use when checking for breaking military news, missile alerts, airstrikes, or geopolitical escalation between Iran, Israel, and the US. Triggers on questions about Iran attacks, Israel strikes, Middle East military alerts, OSINT updates, or escalation monitoring.
design
by neurofoo
Design Thinking process—Empathize, Define, Ideate, Prototype, Test. Use for product design, solving ambiguous problems, or when you don't know what users really need.
ifq-design-skills
by peixl
"Use this skill whenever the user asks for an HTML-first visual design deliverable or design judgment: interactive prototype, slide deck, motion demo, infographic, dashboard, landing page, whitepaper, changelog, business card, social cover, brand system, design critique, multi-variant exploration, or export to MP4, GIF, PPTX, PDF, or SVG. It is optimized to make AI agents do the routing, template selection, verification, and export prep so humans spend less time prompt-engineering. Do not use for production web apps, SEO sites, backend systems, or pure copy edits."
figma-plugin
by srstomp
Use when building Figma plugins, creating design automation tools, implementing sandbox/UI communication, or working with the Figma Plugin API for node manipulation, styles, and components.
free-imagegen
by NimaChu
Fully local free text-to-image skill for OpenClaw and general assets. Generates SVG from prompt, then converts SVG to PNG with local tools only (no online API calls).
product-engineer-agent
by michaelboeding
Use this skill to design new products, iterate on product ideas, or develop product specifications. Triggers: "design product", "new product idea", "product concept", "product development", "product spec", "iterate on product", "product design", "invention", "prototype spec", "product requirements", "product engineering", "develop product" Outputs: Product specification, BOM estimate, feature breakdown, differentiation analysis.
brand-research-agent
by michaelboeding
Use this skill to analyze a brand from their website before creating content. Triggers: "analyze brand", "research brand", "brand guidelines", "brand profile", "understand brand", "brand colors", "brand voice", "before creating content for" Extracts: colors, typography, voice/tone, products, audience, competitive positioning. Outputs a reusable brand_profile.json that producer skills can use.
gc-review-branding
by dougkeefe
Review code for Government of Canada branding compliance - verifies Federal Identity Program symbols, typography, design tokens, and GC Design System patterns
UX Patterns - Skill
by rufuspollock
```
ux-design
by sebnow
"Use when designing user interfaces, improving UX, or creating design specifications. Enforces user-centered process, WCAG 2.1 AA accessibility, mobile-first approach. Triggers: 'design interface', 'improve UX', 'user experience', 'accessibility', 'responsive design', 'user flow'."
ui-design
by sebnow
"Use when implementing visual design, styling components, or building design systems. Enforces intentional aesthetics, systematic design tokens, production-grade implementation. Triggers: 'implement design', 'style component', 'design system', 'design tokens', 'visual design', 'component library', 'frontend styling'."
apple-developer-toolkit
by Abdullah4AI
"All-in-one Apple developer skill with three integrated tools shipped as a single unified binary. (1) Documentation search across Apple frameworks, symbols, and 1,267 WWDC sessions from 2014-2025. No credentials needed. (2) App Store Connect CLI with 120+ commands covering builds (find/wait/upload), TestFlight, pre-submission validate, submissions, signing, subscriptions (family-sharable), IAP, analytics, Xcode Cloud, metadata workflows, release pipeline dashboard, insights, win-back offers, promoted purchases, product pages, nominations, accessibility declarations, pre-orders, pricing filters, localizations update, diff, webhooks with local receiver, workflow automation, and more. Requires App Store Connect API key. (3) Multi-platform app builder (iOS/watchOS/tvOS/iPad/macOS/visionOS) that generates complete Swift/SwiftUI apps from natural language with auto-fix, simulator launch, interactive chat mode, and open-in-Xcode. Requires an LLM API key and Xcode. Includes 38 iOS development rules and 12 SwiftUI best practice guides for Liquid Glass, navigation, state management, and modern APIs. All three tools ship as one binary (appledev). USE WHEN: Apple API docs, App Store Connect management, WWDC lookup, or building iOS/watchOS/tvOS/macOS/visionOS apps from scratch. DON'T USE WHEN: non-Apple platforms or general coding."
builder-ux
by Bbeierle12
Builder user experience systems for Three.js building games. Use when implementing prefab/blueprint save/load, undo/redo command patterns, ghost preview placement, multi-select, or copy/paste building mechanics. Covers the UX layer that makes building feel responsive and intuitive.
browser-workflow-generator
by neonwatty
Generates, creates, or updates browser workflow files. Use this when the user says "generate browser workflows", "create browser workflows", "update browser workflows", or "iterate on browser workflows". Thoroughly explores the app's codebase to discover all user-facing features, routes, and interactions. Creates comprehensive numbered workflows with substeps that cover the full user experience.
ios-workflow-generator
by neonwatty
Generates, creates, or updates iOS workflow files for testing web apps in Safari on the iOS Simulator. Use this when the user says "generate ios workflows", "create ios workflows", "update ios workflows", or "iterate on ios workflows". Thoroughly explores the web app's codebase to discover all user-facing features, pages, and interactions. Creates comprehensive numbered workflows with substeps that cover the full user experience when viewed on iOS Safari.
codeium-ui-skills
by ihlamury
Codeium's UI design system. Use when building interfaces inspired by Codeium's aesthetic - dark mode, Inter font, 4px grid.
frontend-design-fix
by matteocervelli
Fix generic frontend designs by applying aesthetic upgrades across the 5 design dimensions
frontend-design
by matteocervelli
Create distinctive, production-grade frontends by composing design dimensions and tech-specific implementations
tinkering
by rfxlamia
Safe experimentation framework for AI agents. Creates isolated sandbox environments for trying new features, testing approaches, and exploring solutions without polluting the main codebase. USE WHEN: Agent needs to try something uncertain, explore multiple approaches, test a new library, prototype a feature, or run a technical spike before committing to implementation. PRIMARY TRIGGERS: "experiment with" = Setup sandbox + run experiment "try this approach" = Quick experiment in sandbox "spike" / "POC" / "prototype" = Time-boxed technical investigation "tinker" / "tinkering mode" = Enter experimentation workflow "explore options" = Multi-approach comparison in sandbox NOT FOR: Debugging (use debugger), testing (use test runner), or committed feature work (use git branches). DIFFERENTIATOR: Unlike git branches (for committed direction), tinkering is for "I don't know if this will work" exploration. Try 5 things in sandbox before committing to a branch. Faster feedback, zero codebase pollution.
n26-ui-skills
by ihlamury
N26's UI design system. Use when building interfaces inspired by N26's aesthetic - dark mode, Inter font, 4px grid.