#SkillRepo stars

1. 289Art DirectorNewenergyEric/art-director-skillHelp art directors turn references, taste and samples into a shareable project pack, then guide teammates and agents to create, review and deliver consistent components. Use for art-direction setup, visual systems, multi-category production and revisions in games, UI and campaigns.5
2. 290Frontendadamholter/frontend-skillAlways read anytime you're making any UI the user will see, whether that's a one-off HTML file or a tool they're building. Any visual artifact at all.5
3. 291Mente Designereulucasduty/mente-designerDNA de design de 20 sites premium (engenharia reversa via DevTools) — a fórmula Webflow/HTML + Lenis + GSAP/ScrollTrigger destilada em leis, calibres medidos e 22 efeitos nomeados com código. Use ao criar landing pages animadas, sites com scrollytelling, heroes tipográficos, vídeo-fundo, marquees, pin/scrub ou qualquer página que precise de "feel" de agência de elite.5
4. 292Sprite Forgeisabellagreco1997/sprite-forgeTurn any pixel-art image (real or AI-generated) into clean game sprites, new poses and animations (idle, walk) that keep the character consistent. Use when asked to extract a character from a screenshot, make a sprite, re-pose a sprite, animate a pixel character, build a walk/idle cycle, or put an animated sprite back into its scene.5
5. 293Toutourmatt-ye/ToutourAdd a spotlight onboarding tour to any website. Analyzes the site's layout, tabs and UI components, interviews the developer (step granularity, mask, languages, theming, trigger mode, library), then generates and Playwright-verifies a guided tour. Use when the user asks for an onboarding tour, product tour, guided walkthrough, coach marks, feature introduction overlay, or says users can't figure out their site.5
6. 294AI UIconfig Skillvoderment/AI-UIconfig-skillRefactor an existing SwiftUI project into a governed UI architecture with render-state boundaries, tokenized styling, preview mocks, and a debug-only runtime tuning + writeback tool. Use when the user wants to improve UI maintainability, live-tune styles, or build a reusable UI debugging workflow without changing the product's visual intent.5
7. 295Ascii Shader TsxCodeptor/ascii-shader-tsxGenerate animated ASCII art, dithered visuals, and shader-like effects as self-contained React/TSX components. Use when the user wants to create ASCII backgrounds, dithered image/video effects, CRT/retro overlays, matrix rain, noise fields, halftone patterns, particle systems, braille art, terminal aesthetics, or any text/character-based visual effect for the web. Supports both generative (procedural, no input) and source-based (images, video, webcam to ASCII) modes. Also triggers when the user wants to convert an image to ASCII, add a dither effect, create a canvas shader component, build a r5
8. 296Design Mapper Skillbilioveloso/design-mapper-skillIntelligent design brief router. Takes any design request and emits a structured routing plan — which skills to load, in what order, with what focus parameters. Always load this skill FIRST when receiving a design brief. It is the entry point for the entire modular design system. Trigger on: "design a", "create UI for", "branding for", "what should it look like", "color scheme for", "design brief", "visual identity", "/design", intent=design_brief.5
9. 297Design Reviewhumbleteam/design-reviewRun a structured UX critique on a screenshot, URL, or HTML snippet - a 0-4 score, up to 6 prioritized issues each with Before/After/Why, and one citation per claim. Given two or more variants, compares them on shared dimensions and names a winner. Given a screen plus a decision question, answers the question with the screen as evidence instead of returning a critique. Trigger phrases - "review this design", "critique this screen", "what's wrong with this UI", "score this design", "which of these two is better", "did the redesign improve this", "should I use a modal or a drawer". Do not use for5
10. 298DeslopifyAntonioSpagnol/UI-Deslopify-SkillAudits and refactors vibe-coded UIs by replacing each slop element with modern 21st.dev components or equivalents with real visual character — never removes without replacing. Runs a mandatory grill-me style interview (one question at a time, with recommendations) before touching files, including brand identity and design references. Use when the user asks to deslopify, refatorar UI, limpar design, refactor UI, clean design, replace components, or when the code has glassmorphism, purple/blue gradients, decorative orbs, spinners, or empty corporate copy.5
11. 299Figma to Roblox UIxtrair/figma-to-roblox-uiImport Figma frames and designs into Roblox Studio GUI (ScreenGui/Frame/ImageLabel): Scale-only layout, centered AnchorPoint, UIStroke ScaledSize, UICorner in Scale, detailed art and custom shapes exported as images. Use for any Figma to Roblox UI transfer.5
12. 300Frontend Feature ArchitectureArthurblaya/frontend-feature-architectureOrganize frontend code by feature with explicit ownership and one-way dependencies. Use when adding a frontend feature, deciding file placement, reviewing architecture, or migrating a frontend folder structure across web, mobile, and desktop projects.5
13. 301HTML Skill EffectivenessYardonYan/html-skill-effectivenessGenerates self-contained single-file HTML artifacts — visually polished, zero dependencies, openable straight in a browser. Covers 13 layout patterns, a 5-dimension critique system and DevLoop iteration, under 7 enforceable craft rules (anti-ai-slop, color, typography, hierarchy, animation, accessibility, laws-of-ux) plus state-coverage and form-validation contracts. Use when the user asks for a report, comparison, dashboard, slide deck or interactive explainer delivered as one HTML file. NOT for auth, payment, backend logic or real-time database scenarios — refuse and inform the user in those5
14. 302Lean Canvas Coachxntj-ai/lean-canvas-coach交互式教练：用教练式提问带一位创始人/老板走完一张「精益画布」(Lean Canvas 9 格)， 然后揪出那个最要命的「关键假设」，再帮他设计一个「最低成本验证」去先验它。 不是做一次就完——支持每月/每周把新情况丢进来「重跑」，看关键假设变没变。 三模式：interview(我访谈你→画布→关键假设→最低成本验证)、rerun(拿旧画布+新情况→重跑更新)、script(我出提问脚本你自己填)。 是**会做功课的教练**——每一格你答完，我都补一手(调研核实/起草候选/先立后破地质疑/点破框架坑)，跟你共创，不把画布的活儿全压给你；不是只会问的问卷机，也不是空表让你自己填。 Use when: 用户要做商业模式分析/精益画布/lean canvas、说"帮我理一理这门生意""我这想法到底成不成""最大的风险在哪""帮我做个商业画布""访谈我出画布"、或已有画布要重跑更新。 NOT for: 写商业计划书/BP 全文、纯财务建模、个人IP定位(用 ip-canvas-coach)、写单篇文案(用 voice-dna / luo-restyle)。5
15. 303Logo IntroCJ10110425/logo-introBuild an animated WebGL logo intro from a brand's SVG logo. The mark arrives from a lens-warped, colour-fringed close-up, the wordmark pulls out of it, a gradient bloom grows, a lock-in beat (a badge pops, two parts snap together, inner layers rise, or the mark spins) sends out a ring, and a shimmer sweeps the logo. Outputs a single HTML file, an embeddable site splash, or an MP4/WebM video. Use when someone asks for a logo animation, brand intro, opening/splash animation for a website, an intro video like ElevenLabs', or to animate a specific company's logo.5
16. 304Logo to Stickershuyanxius/logo-to-stickersTurn a logo, brand mark, or existing IP into a consistent set of playful die-cut paper stickers. Use for brand character extensions, logo personification, website sticker assets, or sticker variations that need actual transparent images; not for redesigning the logo itself.5
17. 305Nasapunk Designduanth/NASA-Punk-UI-SKILLNASApunk retro-futurist frontend design system with a Starfield-inspired modern layer — NASA golden age (1960s–1980s) aesthetic evolved with Starfield's contemporary polish, for building or restyling web pages. Worn white baked-paint panels, gold Kapton insulation foil crinkle gradients, worm-style single-stroke red wordmark, Swiss grid typography (Helvetica + monospace stencil labels), technical documentation textures (rubber stamps, blueprint grids, hazard stripes, rivets, monospace spec tables, mission patches, doc-control bars) — plus Constellation-style four-color emblem stripes, soft-sha5
18. 306Project StewardCheshireMew/project-steward从项目过程与结果提炼治理方法并在明确要求时自我进化；按实施计划审计完成度，研究整理仓库，预防返工，沿根因修复跨层缺陷，治理架构、目录职责、用户链、UI/UX、文档、日志、环境与发布。Use for project-history learning/evolution; audit a plan or repository; understand or organize a codebase; inspect external-tool compatibility, durable operations, and project governance. Excludes isolated function, security, dependency, CI, or monitoring-only work.5
19. 307UI Design IntelligenceDevvNirvana/tvastar-design-claude-code-skillWorld-class UI/UX design intelligence — Tvastar v4.0. TRIGGER on: /design /preview /approved /apply /review /ship /component /heal /tokens /dark /a11y /cro /color /typography /motion /extract /storybook, build page, build component, landing page, hero section, dashboard, nav, card, animation, dark mode, layout, color palette, typography, redesign, make it look better, add animations, style this, improve UI, add polish, professional look, modern design, review my code, check before deploy, is this ready to ship.5
20. 308Visual Identity Designerali4o/visual-identity-designerBuild a professional, precise visual identity (brand identity) for a project, startup, or business — logo direction, color system, typography, application mockups — via a structured 9-stage agency workflow ending in two polished deliverables — a Brand Identity Guide and a Design Language System (built with the docx skill, in the user's chosen language). Trigger any time the user attaches, pastes, or describes a project idea/brief and asks for a "visual identity", "brand identity", "logo", "branding", "brand kit", "brand guide", "design language system", "هوية بصرية", or similar — even without 5
21. 309Scrollytelling Brand Siteabdelrhman2007/scrollytelling-brand-siteBuild an award-level, scroll-told company website with a story told through scroll, a WebGL "layer by layer" 3D print scene, pinned sections, per-service 3D models, a projects gallery, an About page, an optional .NET + SQL Server CMS with contact inbox and private QR contact cards, tuned to near-zero idle CPU/GPU and fully responsive. Use when the user asks for an amazing, premium, Awwwards-style, scrollytelling or 3D website for a company or brand, wants "a site like the Demo House of Prototyping site", or gives a company profile or deck to turn into an immersive site.2
22. 310Tastegatestas4000/tastegateBuild or fix a frontend (landing page, marketing site, dashboard, app screen, component) so it looks designed, not AI-generated, and prove it in a real browser before calling it done. Picks a design direction first (taste), builds on a craft floor (impeccable-style rules), then runs scripts/gate.py, which renders the page at phone and desktop width and fails on overlapping text, sideways scroll, low contrast, tiny tap targets, AI purple gradients, gradient text, emoji icons, eyebrow labels, default fonts, three-equal-card grids and placeholder copy. Use for any UI build, redesign, polish or "m2
23. 311Anti Slop Designwwewtech/anti-slop-designAutonomous Principal Design Technologist and Anti-AI-Slop Specialist. Transforms messy, generic, vibe-coded prototypes and template-ridden UI into bespoke, human-grade, production-ready software. Use whenever building, styling, refactoring, or auditing web apps, SaaS dashboards, landing pages, mobile interfaces, Tailwind CSS, component systems, or when asked to "fix my UI", "make it look professional", "clean up AI slop", "improve UX", or "review frontend design".2
24. 312Build with Better Designbetter-designs/better-design-pluginBuild or redesign a web or mobile interface on a Better Design design system. Use when the user asks for an app, site, page, dashboard or component and wants it built on Better Design, or asks to choose, create or install a design system.1
25. 313Keyword Iconsruthless-coder-ai/keyword-iconsGenerate clean monochrome PNG icons from a keyword — three distinct concepts per keyword, 1:1 aspect ratio, transparent background, recolorable, ready to drop into PowerPoint, Keynote, or docs. Use this whenever the user asks for an icon, pictogram, or "a simple graphic that represents X" (hospital, growth, contract, security, teamwork…), in any language, even if they never say the word "icon". Also use it when the user wants to recolor, resize, or tweak an icon made earlier.1
26. 314ImpresarioShushant17711/impresarioUse when building, creating, designing, redesigning, animating or polishing any website, landing page, portfolio, product page, hero, microsite, component or app screen in any frontend stack — even when the user gives only a subject ("make a website for X") with no style direction. Autonomously invents a memorable, subject-specific concept and ships heavily animated, flowing, award-level (Awwwards style) work without asking the user for style choices. Also use when a result looks generic, templated, AI-made, flat, static or lifeless.
27. 315Multi Stack MCPVovikP/multi-stack-mcpGenerate native UI sections (hero, pricing, features, CTA, footer) for Next.js, Flutter, WordPress, or Vue from a unified pattern catalog with shared design tokens. Use when the user asks to "add a hero", "insert pricing section", "build landing page section", "create Flutter widget for marketing block", or wants the same brand styling applied across multiple stacks.
28. 316Pdp Auditllizell/pdp-auditResearch-backed UX and conversion audit of ecommerce product detail pages (PDPs). Use this skill whenever the user wants to review, audit, critique, or improve a product page — including requests like "review this PDP", "audit my product page", "why isn't this page converting", "UX review of [URL]", "check this product page against best practices", or when the user shares a product page URL or screenshots and asks for feedback. Also trigger for CRO reviews, conversion audits, or design QA of product pages, even if the words "audit" or "PDP" are not used.
29. 317Pro Motionjack-reson8/pro-motionPro Motion: make a high-taste motion-graphics launch film, brand film, TVC or promo video and the unconventional campaign around it, audio first: pick a surprising campaign mechanism (media hijack, fake-broken ads, meme replies, UGC army, FOOH), plan the music as a marketing asset, then render the film in code (canvas to MP4) cut to the beat with AE-style effects. Also builds stylized web pages the same way (official site, landing page, interactive hero: live WebGL type, cutout subjects, try-with-your-photo, waitlist). Use when the user asks for a launch video, product film, brand ad, app prom
30. 318Scanning For Accessibility Issuesjeremylongshore/claude-code-plugins-plus-skillsThis skill enables Claude to perform comprehensive accessibility audits. It uses the accessibility-test-scanner plugin to identify WCAG 2.1/2.2 compliance issues, validate ARIA attributes, check keyboard navigation, and assess screen reader compatibility. Use this skill when the user requests an accessibility scan, audit, or compliance check, or when terms like "WCAG", "ARIA", "screen reader", "accessibility testing", or "a11y" are mentioned. It provides actionable insights for improving web application accessibility.