Design and UX skills

inematds/power-design

Skill Claude CodeCodex

Generate beautiful HTML presentation slides in any brand's design language — combining brand DNA extracted via Firecrawl with 20 codified design principles.

gravity-ui/skills

Skill Claude CodeCodex

Builds, fixes, styles, and composes UI with the Gravity UI design system — the React ecosystem of @gravity-ui/ packages (uikit, charts, table, navigation, date-components, icons, and more). Routes to the correct package when look-alikes exist, applies theming and required setup, and prevents invented component APIs.…

prisma-ddti/skills

Skill Claude CodeCodex

Web accessibility best practices for semantic HTML, ARIA attributes, and WCAG color contrast. Use this skill whenever the user writes, reviews, or fixes HTML/JSX/TSX/Svelte markup or UI components, builds page structure, navigation, forms, buttons, modals, or tabs, picks text/background colors or theme tokens, or…

avonni/skills

Skill Claude CodeCodex

Add, update, or remove Avonni components inside an existing Salesforce Digital Experience site. Use when the user wants to place Avonni components on a site page, when editing a site view's content.json that contains avxp: or avcmpbuilder: components, or when wiring those components to records, navigation, or styling.…

kkemple/skills

Skill Claude CodeCodex

Build and validate Slack Block Kit JSON using orchestrated multi-role adherence-coherence convergence. Use this skill when the user wants to build Block Kit layouts, generate block structures, create element compositions, construct surface-specific UIs, validate existing Block Kit JSON, or improve Block Kit payloads.…

jonmumm/skills

Skill Claude CodeCodex

Two-phase design loop like /swarm but for visual design. EXPLORE: launches N parallel subagents in Figma — each designs a distinct concept on its own page simultaneously, then cross-model consensus (Claude + Codex) picks the winner. DEEP: iterates the chosen concept with critique → impeccable skills → fixes until it…

zunyiqingfeng-code/skills

Skill Claude CodeCodex

High-fidelity HTML prototyping, interactive demos, slide decks, animations, design exploration with expert review. Embodies different design personas (UX designer, animator, slide designer, prototyper). Use when user mentions prototype, design demo, interactive prototype, HTML demo, animation demo, design variant, UI…

DonggangChen/antigravity-agentic-skills

Skill Claude CodeCodex

Guide for conducting comprehensive accessibility audits of code to identify WCAG compliance issues and barriers to inclusive design. This skill should be used when reviewing accessibility, ARIA implementation, keyboard navigation, or screen reader compatibility.

LiozShor/claude-code-skills

Skill Claude Code

Create self-contained HTML visualizations (single .html file) from conversation content, data, or ideas. Trigger on: "visualize this," "make a deck/slide/infographic/dashboard," "build a one-pager / poster / carousel / kanban / mind map / org chart / flowchart," "show me a chart," "render as HTML," or any ask to…

aziontech/webkit

Skill Claude CodeCodex

Accessible forms on @aziontech/webkit — one Form Layout spacing reference (xs inside a field, lg between fields/rows) shared by five form types (Drawer, nested Drawer, Dialog, ItemGroup settings, CardBox with independent saves) that differ only in container + save model, with two internal layouts (Cards + ItemGroups /…

AntonioMellies/claude-code-skills

Skill Claude CodeCodex

Atua como Principal Product Designer e Enterprise UX Architect especializado em Material Design 3 adaptado para SaaS B2B, CRM, ERP, Backoffice e plataformas corporativas complexas. Prioriza produtividade, densidade de informação, eficiência operacional, Design Tokens e acessibilidade.

frankxai/claude-code-oracle-skills

Skill Claude CodeCodex

Generate professional OCI architecture diagrams with verified Oracle styling and icons.

shaynemeyer/claude-code-awesomeness

Skill Claude CodeCodex

Always use when user asks to create, generate, draw, or design a diagram, flowchart, architecture diagram, ER diagram, sequence diagram, class diagram, network diagram, mockup, wireframe, or UI sketch, or mentions draw.io, drawio, drawoi, .drawio files, or diagram export to PNG/SVG/PDF.

billbuchanan-code/claude-code-power-setup

Skill Claude Code

Create all design artifacts (discovery, spec, plan, tasks, checklists) in one command with inline clarifications.

timsearle/agents

Skill Claude Code

Apply Apple's Liquid Glass design language to navigation and controls using current SwiftUI or lower-level platform APIs. Use for glass effects, floating controls, toolbars, tab bars, and Liquid Glass design reviews.

tarosky/claude

Skill Claude CodeCodex

A skill for creating WordPress.org plugin icons and banner images that follow Tarosky brand guidelines. WordPress.org is the directory where WordPress plugins are published.

unclutter-pro/atlas

Skill Claude CodeCodex

Design any visual output — websites, landing pages, SaaS apps, dashboards, documents, reports, presentations, posters, infographics, or any UI/layout/typography/color work. Use when the user asks to build, design, style, or create anything visual, even if they don't explicitly say "design." Also use for visual…

GuilhemBusset/agentic-or-workshop

Skill Codex

Standardize repository HTML pages to a shared Atom One Dark visual system. Use when asked to align look and feel across multiple HTML files, generate per-page UI component guidelines, apply a consistent theme stylesheet, and verify compliance across all HTML labs.

Myra-Agents/Myra-Agents

Skill Claude CodeCodex needs its repo

Storybook is the fidelity oracle, not the runtime. The converter bundles the package's compiled dist/ into dsbundle.js — the same bundle the claude.ai/design agent builds with — and generates each preview by compiling the story source module itself (hooks, fixtures, local helpers — the whole closure comes along), with…

yinyucheng0601/pto-design-system

Skill Claude CodeCodex

A set of rules for building or changing PTO pages with shared layouts, design tokens, components, and patterns. A design system is a reusable collection of interface rules and building blocks.

parcyun/pre-design

Skill Claude CodeCodex

A preparation process for visual design work. It asks about the medium, audience, tone, brand, size, and constraints, then helps choose a visual direction before work begins.

AetherOps/etsy-digital-studio

Skill Claude CodeCodex

Autonomous design studio for creating and selling premium digital products (UI kits, Figma templates, dashboard designs, design systems, component libraries) on marketplaces like Etsy, Gumroad, and Creative Market. Activate when the user wants to: CREATE a sellable digital design product, RESEARCH a marketplace niche…

Catmint103/xilehui-brand-agent

Skill Codex

A design workflow for creating and reviewing branded event materials for Xiamen University's School of Management alumni association. It covers posters, digital tickets, registration graphics, social-media images, screen graphics, and editable designs.

demoniksem/superpowers-hermes-skills

Skill Claude CodeCodex

Senior UI/UX Engineer. Architect digital interfaces overriding default LLM biases. Enforces metric-based rules, strict component architecture, CSS hardware acceleration, and balanced design engineering.