Art & Design
nex-ai-skills
Use when choosing or installing a free skill from this Nex AI repository, or when a task matches one of its guides: developer checks, web and accessibility audits, browser extensions, compliance packs, finance and property admin, or small-business operations. Route to the matching guide in skills/ or the named plugin and follow that guide. Do not perform the guide's work from this file.
$ npx skills add NexaiGuy/nex-ai-skillsnftdata-mcp
Fetch live OpenSea NFT collection market data (floor price, 24h/7d/30d/lifetime sales and volume, contract addresses, total supply, unique owners, creation date) through the NFT Data MCP server's get_collection_data tool, paid per call at $0.002 USDC on Base mainnet via x402 v2 (default) or MPP evm/charge. Use when a user asks about a specific NFT collection by OpenSea slug, wants floor price or volume stats, or wants two or more collections compared. Read-only; not a search, wallet, trading or transaction tool.
$ npx skills add Nomad07/nftdata-mcphiragiyayoi/muji-design
A Japanese design language for generating UI, grounded in the philosophy of MUJI (無印良品) with optimization as its core, the spatial grammar of the Japanese room (washitsu), and a 46-color reference palette used as a base. Use when building or restyling web or app UI that should feel quiet, warm, low-saturation, and uncluttered — settings screens, dashboards, content pages, forms, and product UI in this style.
$ npx skills add hiragiyayoi/muji-designhaomiaoyan/visual-narrative-site
Use when building or fixing a multi-chapter scrollytelling / interactive visualization website (React+Vite+GSAP, canvas/WebGL hero, long pinned horizontal stage, light/dark themes) and the deliverable must pass script-verifiable acceptance (no horizontal overflow, WCAG contrast, 60fps, reduced-motion, evidence-cited claims) — includes gating interview, plan review, measurement recipes and a 22-item pitfall catalog.
$ npx skills add haomiaoyan/agent-skillsrosby17/charte-graphique
Construire l'identité visuelle complète d'un client, du logo à la charte graphique imprimable et ÉDITABLE dans InDesign, avec toutes ses déclinaisons, selon la méthode de Roosevelt Mogo : brief, logo (création par prompts ChatGPT ou logo existant), vectorisation fidèle d'un aperçu validé, palette HEX/RVB/CMJN (profil FOGRA39)/Pantone, typographies, pack de logos (SVG, PDF, EPS, PNG en couleur, négatif, blanc, noir, mono), charte A4 paysage de 30 pages et plus (.indd, IDML, un seul PDF HD, sommaire cliquable), carte de visite, papier à en-tête, enveloppe, kakemono, badge, mises en situation et livrables rangés pour le client et l'imprimeur. Reproduit aussi au pixel près un visuel validé (carte, flyer) en PDF d'impression. Utilise-le dès qu'on parle de « charte graphique », « identité visuelle », « brand book », « guide de marque », « déclinaisons du logo », « papeterie », « carte de visite », « kit de marque », « logo pour un client » ou « version imprimable » d'un visuel.
$ npx skills add rosby17/skill-charte-graphiquecapsrock/nordic-civic-design-skill
非公式のスキルです。北欧の公共サービスのような、角を丸めない形、強い色、広い余白、大きな文字階層を持つ Web 画面を設計・実装・見直しするためのスキル。Helsinki Design System(HDS)の公開トークンと部品の値を土台にしている。「北欧の行政サイト風に」「HDS 風に」「市民向けサービスの画面を」「公共サービスらしく、でもデザイン性高く」といった依頼のほか、申請フォーム、案内ページ、自治体や公共施設の Web 画面を作るときに使う。HDS の名前が出ていなくても、公共向けの Web 画面で強い個性とアクセシビリティの両方を求められているなら使う。ヘルシンキ市の公式デザインの再現や、市の公式サイトを装う用途には使わない。
$ npx skills add capsrock/nordic-civic-design-skillanfrageozmarketing/unslop-audit
Scores an app 0-36 across nine dimensions (identity, onboarding, core loop, settings, states, structure, copy, visuals, components), lists "AI-structure tells" with file evidence, and writes a prioritized report. Use first on any "check the app", "review this product", or "what is missing" request, and again after changes to show the score change.
$ npx skills add anfrageozmarketing/unslopUIanfrageozmarketing/unslop-components
Makes app UIs creative and domain-specific instead of looking like a form, a thousand tables and rows of KPI cards. Gives a process to pick a signature component per screen from the shape of the data (route map, strip, lanes, matrix, timeline, graph, stream), bans the default table/card/dropdown look, and sets a gate. Use when an app screen is built from tables, uniform card grids, stat tiles and form fields, or when the user asks for more creative, less "admin template" components.
$ npx skills add anfrageozmarketing/unslopUI66666-design/ai-design-director
让 AI 做出不像 AI 的设计。做网页、落地页、App 界面、主题配色、海报、演示页等任何视觉设计时加载。按「发现→定义→交付」三段走:用随机种子串打破默认审美、用大胆具体的创意简报、用只看截图的独立评审子智能体打分迭代、用生成图片/视频丰富画面,最后做减法、清除 AI 痕迹。Make AI-built designs that don't look AI-made.
$ npx skills add 66666-design/ai-design-directorHonest-Ghost/3d-by-arman
Build and deploy a cinematic scroll-driven 3D website for any business or idea using Google Flow and vanilla web tech. Use when the user asks to build a website, landing page, cinematic site, scroll site, 3D site, one-page site, or hero-video site for any business, product, brand, place, portfolio, or concept (plumber, lawyer, hotel, SaaS, coffee shop, design studio, anything). Also activates whenever the user types /3d-by-arman in Claude Code, Antigravity, Cursor, Codex, or other AI agents.
$ npx skills add Honest-Ghost/3d-by-armanszcharlesji/tikz-live
Build an interactive, explorable figure in the TikZ/dlviz style (Canziani NYU-DL look) where the reader drags points, moves sliders, hovers rows or plays steps, while every static part stays real LaTeX typography. The static scaffold is compiled from TikZ, a small JS spec draws the live part in the same coordinates, and the build outputs one self-contained HTML page plus PNG snapshots to check. Use this whenever someone wants an interactive, live, explorable, draggable, animated, "play with it", slider or hover version of a technical or ML/DL diagram (optimizers, attention, convolution, linear maps, loss landscapes, sampling, normalization...), wants to make an existing TikZ figure interactive, or wants interactive figures for a web book, course notes, a blog or an artifact. For a static figure (slides, papers, print), use tikz-dl-visualizer; for a whole illustrated web book with many figures, use tikz-explorer-book, which builds its live figures with this skill.
$ npx skills add szcharlesji/tikz-skillsvictor-lis-bronzo/imagine-it
Turns a feature spec into speculative HTML mockups styled after the current repo's design. Use when the user wants to visualize, mock up, wireframe or "see" a feature, issue, ticket, PRD or idea under discussion, or asks to run imagine-it.
$ npx skills add victor-lis-bronzo/imagine-it-skillphido0410/animejs
Anime.js v4 animation (animate, createTimeline, stagger, svg.createDrawable / morphTo / createMotionPath, createScope, utils). Use when the user asks for Anime.js / animejs, or for lightweight JS animation of DOM, SVG, CSS variables or plain JS objects. v4's API differs from v3 — there is no anime() default export.
$ npx skills add phido0410/claude-video-skillsn0ctx/tavern-aesthetic
Use for tavern-style page and frontend design.
$ npx skills add n0ctx/skillsszcharlesji/tikz-explorer-book
Build a figure-first "explorer" web book for a course, syllabus, reading list or research field. The home page is an interactive Obsidian-style concept map with a guided tour; it leads into chapters, each built around 2–3 computed TikZ figures with reading-guide captions, where the key mechanism of a chapter can be a live figure the reader drags, slides or hovers (tikz-live) while static figures come from tikz-dl-visualizer. The result is published as one web page. Use this skill whenever someone wants a visual companion, illustrated notes, a study guide, a "book", a concept map or mind map of a field, or a big-picture overview that connects the ideas and papers everyone should know before going deep. Typical asks are "make a book for this course", "help me see the big picture of X", "illustrated guide to the papers on this syllabus", "something like Obsidian for generative models", "chapters with diagrams for each week". Use it even if they never say TikZ, and especially when they say diagrams and intuition
$ npx skills add szcharlesji/tikz-skillsnivelsulfluminense/scroll-web-skills
Constrói sites cinematográficos guiados por scroll, do briefing ao deploy: entrevista curta, direção de vídeo com geração de prompts detalhados para Veo 3, Seedance 2 e outros modelos (vídeo de fundo ou regiões específicas com conteúdo, formato, extensão, resolução e fps), jornada e curva de sensação com um pico, Style Tile em HTML real, tabela Visual Story, mídia gerada ou do cliente com continuidade entre cenas, palco de canvas fixado sem sequestro de scroll, versão mobile composta à parte, auditoria em navegador real e entrega. Alvos: HTML estático, React/TanStack Start e projetos Lovable com Supabase. Use para "site 10k", "site cinematográfico", "scroll que toca vídeo", "prompt para Veo 3 / Seedance 2", "scrollytelling", "landing estilo Apple", "scroll-craft" ou projetos com pasta .10k/.
$ npx skills add nivelsulfluminense/scroll-web-skillsshusain/room-first-building-study
Design conceptual buildings from their room programs. Use for dimensioned SVG layout options, editable staged Blender studies, and model-derived material takeoffs across building types. Reuse geometry, clearance and assembly helpers with project-specific recipes.
$ npx skills add shusain/ai-agent-skillscclank/lanshu-html-ppt-templates
基于 30 套岚叔 HTML 演示模板创建、改写和定制演示文稿,支持商务汇报、政企汇报、路演、发布会、学术答辩、教学课件、数据叙事与交互演示。用户需要 HTML 幻灯片、网页 PPT 或使用这些模板制作演示时使用。
$ npx skills add cclank/lanshu-html-ppt-templatesProtonicwave/web-ui-craft
Design and build web interfaces that look deliberate rather than generated. Use whenever creating or restyling a website, landing page, web app screen, dashboard, component, HTML or CSS page, or React, Vue or Svelte UI, and whenever the user asks for something beautiful, polished, distinctive, modern or not AI-looking. Forces a written design brief derived from the subject, applies evidence-based defaults for type, colour, spacing, depth, motion, navigation, states, performance and accessibility, and ends with a critique pass that removes generic AI tells.
$ npx skills add Protonicwave/claude-skill-designdavepartner/ui-ux-20-laws
Operationalize the 20 fundamental laws of UI/UX design into every interface an agent builds — apps, design systems, and websites — plus world-standard rules for account surfaces (profile page, logout, privacy/terms/GDPR, support). Use when designing, building, or reviewing any user-facing screen, component, form, navigation, pricing page, checkout, onboarding flow, profile page, or account/auth surface. Enforces zero-friction journeys, <400ms perceived performance, and clear visual hierarchy. Triggers: "apply UI/UX laws", "design a form/checkout/pricing/onboarding flow", "profile page", "settings page", "logout flow", "delete account", "privacy policy", "terms of service", "GDPR", "support page", "make this interface more usable", "review this UI against design principles", "reduce cognitive load", "improve perceived performance", "Hick's Law", "Fitts's Law", "Miller's Law", "Gestalt", "accessibility target sizes", "optimistic UI", "visual hierarchy", "chunk this form/nav/data".
$ npx skills add davepartner/20-ui-ux-lawsThanedee/design-standard
Professional design standard for any visual: social posts, carousels, flyers, logos, slides, video, print, web and AI-generated images. Use when creating, editing or reviewing a design.
$ npx skills add Thanedee/design-standard-skillMethodicDev/candor-agent-ui
Design fundamentals for screens where an AI agent acts - a chat with an AI agent, tool calls, approvals and permission prompts, plans, runs, diffs, audit logs and the pages around them. Use when building or reviewing any agent UI, approval flow or tool-call display, in any framework and with any design system; Candor UI is not required. Covers the nine honesty rules with examples, approval ergonomics, the status vocabulary and the states of a tool call, when to fold turns, what to show while an agent works and when it finishes while the person is away, blast radius and undo, AI disclosure, accessibility, and a review checklist to run after each screen.
$ npx skills add MethodicDev/candortsvetaeff-den/ai-ready-sites
Design, build, improve, or audit websites and web interfaces; write or edit site copy, product instructions and technical documentation, including RU/EN translation. Use for landing pages, product UI, responsive components, redesigns and readiness checks. Scope text-only work, small fixes and audits to the request. Not for backend-only implementation or native apps.
$ npx skills add tsvetaeff-den/ai-ready-sitestmj-90/design-system
Use when a ticket needs a *systematic* token + component foundation for a frontend — the three-layer token architecture (primitive → semantic → component), W3C DTCG design-token files, theming and dark mode, component specs with full state coverage, or a recommendation for which design system a product should have. Invoke for "set up design tokens", "define the component system", "we keep hardcoding colours — fix it", "what design system should this product use", or as the structural backbone th
$ npx skills add tmj-90/gaffer