Claude Code CSS plugins and skills

electron: Build cross-platform desktop apps with JavaScript, HTML, and CSS.

5 skills

@electronInstall Plugin

Turns a brief into a design prototype, website, app, deck, or video that follows your design system, then lets your team share it and refine it with an AI agent in the same project.

170 skills

@nexu-ioInstall Plugin

Skills and an MCP server for Storybook, the tool for building, documenting, and testing UI components in isolation. Covers canary releases, docs review, PR comment handling, lint and type fixes, and QA labels.

10 skills

@storybookjsInstall Plugin

A plugin of skills for building videos from HTML with HyperFrames, covering motion design, transitions, captions, cursor effects and changelog videos. Useful for developers and agents who want to render motion graphics and product videos.

15 skills

@heygen-comInstall Plugin

A Codex plugin with skills, agents, and MCP servers for development work. Includes diagnostics, LSP code intelligence, comment checking, and tools for reporting and fixing bugs in LazyCodex and Codex CLI.

34 skills

@code-yeongyuInstall Plugin

A Codex and Claude Code plugin for agent orchestration, with skills for LSP diagnostics, comment-checker feedback, health checks, and filing bug reports for LazyCodex and omo-codex.

33 skills

@code-yeongyuInstall Plugin

Skills that help designers and engineers make better UI animation decisions faster, covering when to animate, which properties and curves to use, keeping web motion within the frame budget, and React Native and Expo animation.

18 skills

@emilkowalskiInstall Plugin

A design skill for Claude Code, Cursor, and Codex that builds new pages and apps, audits existing ones, and redesigns them or extracts design from URLs or screenshots, with the aim of avoiding a generic AI-generated look.

1 skill

@nutlopeInstall Plugin

Cherry Studio is an AI workstation for Windows, macOS, and Linux. Chat with multiple models, work with agents, build knowledge bases, create images, and automate everyday tasks in one place. Cherry Studio Mobile is now available for iOS and Android!

13 skills

@cherryhqInstall Plugin

Helps designers and engineers make the right animation and interface choices faster, from deciding whether to animate and which properties and curves to use, to keeping motion smooth and finding the exact term for an effect you can only describe loosely.

16 skills

@emilkowalskiInstall Plugin

Skills for building, converting and migrating MCP Apps with interactive UI views, plus a skill that rebuilds a branch into a clean git commit history.

28 skills

@tldrawInstall Plugin

A browser automation command line tool for AI agents, letting them navigate pages, fill forms, click buttons, take screenshots and extract data from websites.

1 skill

@vercel-labs-2Install Plugin

Create and present web-based slide decks with Slidev, using Markdown, Vue components, code highlighting, animations, Mermaid diagrams, LaTeX math, and PDF export. Built for developers making technical presentations.

1 skill

@slidevjsInstall Plugin

Next-Generation, Fastest HTML5 Creation Engine for the Web WebGL & WebGPU Renderers Unmatched Performance & Speed Easy to use, yet powerful API Asset Loader Full Mouse & Multi-touch Support Flexible Text Rendering Versatile Primitive and.

26 skills

@pixijsInstall Plugin

Skills that guide Claude Code when writing HTML and JSX with the daisyUI component library for Tailwind CSS, covering installation, configuration, usage rules, and color theming.

5 skills

@saadeghiInstall Plugin

Build responsive, accessible UI with Chakra UI, migrate projects from the previous major version, and refactor plain HTML, Tailwind, CSS Modules or styled-components code into Chakra components and themes.

3 skills

@chakra-uiInstall Plugin

Clones a website into a Next.js project using AI coding agents, run through a single command.

@jcodesmoreInstall Plugin

The headless browser for AI agents and web scraping.

1 skill

@h4ckf0r0dayInstall Plugin

Project conventions for AionUi, an open-source cowork app for CLI agents. Covers architecture and file structure, i18n translation workflow, testing standards, and version bumping with release PRs.

4 skills

@iofficeaiInstall Plugin

Gives your AI coding agent ready-made guidance for React and Next.js performance, component design, React Native and Expo apps, and view transition animations, plus a skill to deploy an app to Vercel and get a link.

9 skills

@vercel-labs-2Install Plugin

Helps you build and ship Next.js and React pages with better performance and cleaner component structure, and can deploy them to Vercel. Covers React Native and Expo apps too.

9 skills

@vercel-labsInstall Plugin

A skill that builds animation-rich HTML presentations from scratch or converts PowerPoint files to web slides. Useful for anyone turning a deck into a web presentation.

1 skill

@zarazhangruiInstall Plugin

Beautiful, fast and modern React UI library. (Previously NextUI)

3 skills

@heroui-incInstall Plugin

A skill that generates single-file HTML slide decks with horizontal page turning, speaker view, rehearsal mode, and illustrated visual styles, for use in Claude Code and similar agent environments.

1 skill

@op7418Install Plugin

Gives developers working on the Mastra TypeScript AI framework ready-made help for debugging hard bugs, auditing and diagramming docs, and testing the Studio UI. Each task that used to be done by hand becomes a guided workflow.

33 skills

@mastra-aiInstall Plugin

Skills for building cross-platform desktop applications in Rust with the GPUI Kit framework, covering its components, layout and design guidance. Useful for developers creating native desktop UIs.

2 skills

@longbridgeInstall Plugin

A skill that writes optimized prompts for AI tools such as LLMs, Cursor, Midjourney, and image or video generators. It activates only when you explicitly ask to write, fix, improve, or adapt a prompt for a specific tool.

1 skill

@nidhinjsInstall Plugin

Gives Claude Code skills for automating browser interactions, testing web pages and working with Playwright tests. A separate dev skill covers maintenance tasks for the playwright-cli repository, such as rolling dependencies and releasing.

2 skills

@microsoftInstall Plugin

Lets a coding agent turn your source material into a single-file web article, generate or edit images, answer questions from a local knowledge-base folder, make short motion-graphics videos, and build polished browser pages.

6 skills

@conardliInstall Plugin

Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.

6 skills

@tamaguiInstall Plugin

Gives design, image and video, and knowledge lookup help to AI coding agents. It can build single-file web articles, generate or edit images, make short motion-graphics videos from code, build polished web pages and dashboards, and search a local knowledge-base folder for answers.

6 skills

@conardliInstall Plugin

Generates precise SVG technical diagrams for architecture, UML, agent, cloud and workflow designs from a plain description in English or Chinese. Exports PNG or offline interactive HTML, and can animate supported diagrams to GIF.

1 skill

@yizhiyanhua-aiInstall Plugin

Gives a coding assistant design engineering skills for tidying UI spacing and typography, auditing accessibility like labels, focus and contrast, fixing HTML metadata and SEO tags, and documenting a product's visual system.

9 skills

@ibelickInstall Plugin

Turns text and ideas into finished HTML pages for Claude Code users, with templates for long-form articles, social media cards such as Twitter quotes and Xiaohongshu knowledge cards, and data dashboards and slide decks.

81 skills

@nexu-ioInstall Plugin

A Claude Code skill that writes static HTML presentations with ready-made themes, layouts, and animations, plus a presenter mode with speaker notes and a timer. Use it when you need slides or a deck built as plain HTML.

1 skill

@lewisluluInstall Plugin

Turns Google Stitch designs into working front-end code, such as React, React Native and Vite screens, so you stop rebuilding them by hand.

16 skills

@google-labs-codeInstall Plugin

A Claude Code and Codex skill that generates Rednote image-and-text card sets, Live Photo motion cards and WeChat article cover pairs from articles, screenshots, photos or videos. It offers an editorial magazine visual style for storytelling, lifestyle and travel content.

1 skill

@op7418Install Plugin

A skill for AI coding agents that scaffolds a production-ready Next.js editor for App Store and Google Play marketing screenshots.

1 skill

@parthjadhavInstall Plugin

Production-grade Turborepo template for Next.js apps.

1 skill

@vercelInstall Plugin

Nuxt UI is a library of accessible, typed Vue components built on Reka UI, Tailwind CSS and Tailwind Variants. It works as a module in Nuxt and as a Vite plugin in plain Vue apps.

1 skill

@nuxtInstall Plugin

Browser automation for Claude Code users, using persistent named pages through the dev-browser CLI. Use it to navigate websites, fill forms, take screenshots, extract web data, test web apps, and log into sites.

1 skill

@sawyerhoodInstall Plugin

Adds Preline UI components and blocks to HTML files through the Preline MCP server, and generates, previews, and validates Preline theme CSS. Built on Tailwind CSS.

1 skill

@htmlstreamofficialInstall Plugin

Skills for building virtualized React lists, grids, and tables that handle variable-size items and sticky headers, plus chat message lists, data tables, and reactive state management with the Virtuoso packages.

4 skills

@petyosiInstall Plugin

Runs multiple coding agents in parallel, each in its own git worktree, with support for remote SSH, pull request review and issue ingestion. Works with any provider.

@generalactionInstall Plugin

Gives Claude Code skills for adding CSS transitions and animations to web apps, covering badges, modals, dropdowns, page transitions and motion polish. Includes a skill that animates UI as if an AI agent were generating it.

3 skills

@jakubantalikInstall Plugin

Breaks a complex task into steps and hands each one to a specialized agent for research, coding, design or unattended automation. It also carries memory across sessions so the working setup can improve itself over time.

24 skills

@evermind-aiInstall Plugin

Claude Code skills for generating or editing images with GPT Image through a packaged CLI and reference gallery, plus reverse-engineering image prompts from reference photos.

2 skills

@wuyoscarInstall Plugin

Automates Excel data analysis end to end: reads multi-sheet workbooks, cleans the data, filters and aggregates it, flags outliers and threshold breaches with highlighting, and exports the results as Excel or CSV. Large files are converted to Parquet for faster reading.

84 skills

@opensensenovaInstall Plugin

Gives Claude Code guidance on Anthony Fu's preferred JavaScript and TypeScript tooling, conventions and project setup, plus Nuxt, Nitro and Pinia usage. It also drafts GitHub pull requests with clear titles and bodies, so you spend less time on setup decisions and PR write-ups.

14 skills

@antfuInstall Plugin

A Claude Code skill that turns any codebase into a beautiful, interactive single-page HTML course. Point it at a repo.

1 skill

@zarazhangruiInstall Plugin

Adds the Agentation visual feedback toolbar to a Next.js project so you can annotate page elements for an AI agent. A self-driving skill lets Claude critique a page and add design annotations on its own.

2 skills

@benjitaylorInstall Plugin

Extracts the full design system from any website URL, producing design tokens, Tailwind, Figma variables and shadcn/ui themes, plus a skill that styles UI from the extracted tokens.

2 skills

@manavarya09Install Plugin

A skill for building premium scroll-driven landing pages for service, product, food, and drink brands. It helps plan the visitor journey and page layout, then build animated heroes and bespoke scroll effects.

1 skill

@nateherkaiInstall Plugin

Skills for running empirical economics analysis end to end in Python, Stata, or R, covering DID, RD, IV, synthetic control, and double machine learning. Each skill follows the conventions of applied economics papers and produces paper-style results.

200 skills

@brycewang-stanfordInstall Plugin

Turns complex or visual agent responses, such as plans and comparisons, into HTML artifacts you can annotate and send feedback on, using the lavish-axi CLI.

1 skill

@kunchenguidInstall Plugin

Ears for coding agents. Watch the 0.4 launch film (35 s): its sound effects are takes from the earshot bank placed with the launch kit, plus the one CC0 recording it shows being re-made, over a licensed music track.

2 skills

@leonxlnxInstall Plugin

Inspects Claude Code session logs in a visual UI, showing tool calls, token usage, subagent traces and the context window. Useful for developers who want to see what happened inside a session.

@matt1398Install Plugin

Vizro is a low-code toolkit for building data visualization dashboards. These skills guide Claude Code through designing dashboard layouts, choosing charts, wiring filters and interactions, and building the app from a spec.

6 skills

@mckinseyInstall Plugin

Thirty-three isometric line figures that answer the pointer. For React and for anything with a DOM. Live, with a slider for intensity: hairline.lucasmarkes.com.

2 skills

@lucasmarkesInstall Plugin

Steers your coding agent away from outdated web patterns toward current web platform APIs, checking browser compatibility before it writes HTML, CSS or client-side JavaScript. Also guides building and publishing Chrome extensions.

2 skills

@googlechromeInstall Plugin

Lets Claude Code open your Git changes in difit, a local diff viewer, so you can review commits, branches, or GitHub PRs with inline comments. Explicit opt-in only, triggered when you name difit.

3 skills

@yoshiko-pgInstall Plugin

A collection of general-purpose agent skills for diagrams, documentation, development workflow and drawing tools, installable into the skills folder of Cursor, Claude Code, Codex and similar agents. Each skill is a SKILL.md that the agent calls automatically based on its trigger keywords.

16 skills

@xstongxueInstall Plugin

Scaffolds documentation sites with Nuxt and Markdown, with support for multilingual docs, llms.txt output and an AI docs assistant. Includes a sample skill for testing agent skills discovery.

2 skills

@nuxt-contentInstall Plugin

Gives a coding assistant design skills for building interfaces: audit a UI against accessibility rules, generate a brand design system of tokens, apply a visual style, and build data-heavy dashboards with real charts.

26 skills

@plugin87Install Plugin

A skill that gives Claude Code guidance on motion design, covering timing, easing, choreography, and Disney animation principles adapted for UI. It helps choose emotional intent before writing animation code.

1 skill

@lottiefilesInstall Plugin

Browser automation and verification skills for Claude Code. The browser skill navigates pages, fills forms, extracts page data and captures screenshots, while the check skill tests acceptance criteria in a live browser or recording.

2 skills

@vibiumdevInstall Plugin

A set of agents, skills, commands and hooks for Claude Code, covering areas such as accessibility, API design, authentication and AWS cloud patterns.

40 skills

@rohitg00Install Plugin

A skill that turns AI-generated or existing video and frame sequences into web animations driven by scrolling, pointer, touch, device orientation, audio or data. It handles keyframes, sprite sheets, chroma-key cleanup and timeline runtime setup.

1 skill

@oil-oilInstall Plugin

Turns a raster logo, such as a PNG, JPG, WebP or screenshot, into a clean minimal SVG, then builds an SVG logo animation and an interactive HTML motion demo. Useful for designers who need scalable logo vectors and animated previews.

1 skill

@nolangzInstall Plugin

Created by Damir Sokolovsky (@heydamir), who started the Unslopping series on X. unslop is a skill for Claude that turns vibecoded, AI-looking UI into a designed interface with its own character.

1 skill

@heydamir-2Install Plugin

Skills for building Flutter apps with WebF, a runtime that renders web content through JavaScript, DOM, and CSS. Covers API compatibility, async rendering, infinite scrolling lists, and creating or installing native plugins for device features.

9 skills

@openwebfInstall Plugin

Gives React developers ready-made, customizable components for AI chat interfaces, such as conversations, messages, tool displays and prompt inputs, so they do not build those screens from scratch.

1 skill

@vercelInstall Plugin

Skills that help write Xiaohongshu (Little Red Book) notes, render the content into images, and publish them automatically, including scheduled posting.

1 skill

@comeonzhjInstall Plugin

Extracts design DNA from reference UIs such as images, screenshots, or URLs, covering design tokens, qualitative style, and visual effects, then generates matching UI from your content.

1 skill

@zanweiInstall Plugin

Accessible retro components that you can copy and paste into your apps.Free. Open Source. Built on shadcn/ui. Documentation · Components · Blocks · Themes · Discord.

23 skills

@theorcdevInstall Plugin

Claude Code skills for automating Xiaohongshu (小红书) through your already logged-in browser and real account. They cover login, searching and reading notes, publishing image, video and long-form posts, and commenting, liking and saving.

5 skills

@autoclaw-ccInstall Plugin

Redesigns GitHub README homepages and creates matching SVG, PNG/WebP, or animated GIF visual assets for a project. Use it when you want a README that looks better and reads more clearly.

1 skill

@oil-oilInstall Plugin

A Claude Code skill for video work through VEED's hosted services and a CLI toolkit, covering word-timed transcription, captioning, cutting, background removal, AI presenters, lipsync, sound mixing and rendering HTML to video.

1 skill

@veedstudioInstall Plugin

From the creators of Unistyles: The fastest Tailwind bindings for React Native.

2 skills

@uni-stackInstall Plugin

A set of Agent Skills that take a change from a vague idea to shipped, verified, documented code, for any AI coding agent. One skill per phase. Run only the ones a change needs, in any order.

9 skills

@javascript-mastery-proInstall Plugin

d3k is a local web debugging runtime for coding agents. It starts your dev server and opens a monitored browser, then combines server logs, browser errors, network activity and interactions into one timeline.

1 skill

@vercel-labs-2Install Plugin

A motion and interaction design skill with two modes, build interactive components with purposeful motion, or audit existing animations. Both modes give context-aware, per-designer guidance drawn from three distinct motion-design lenses.

1 skill

@kylezantosInstall Plugin

A comprehensive skill for AI coding assistants that can load SKILL.md files, covering Google's Material Design 3 (Material You) UI system.

1 skill

@hamenInstall Plugin

A motion and interaction design skill with two modes, build interactive components with purposeful motion, or audit existing animations. Both modes give context-aware, per-designer guidance drawn from three distinct motion-design lenses.

1 skill

@kylezantosInstall Plugin

Gives your AI agent tested, fixed code that measures Core Web Vitals, loading, interaction, media and network problems in a page, and returns structured results it can reason about. You can also run the same snippets yourself in DevTools.

6 skills

@nucliwebInstall Plugin

A desktop IDE built for managing AI coding agent sessions, with a kanban board, cost tracking, session resume and a project dashboard. Includes skills for adding npm dependencies and for UI development.

2 skills

@elirantutiaInstall Plugin

GSD Pi is a local-first coding agent for planning, implementing, verifying, and tracking project work from the command line.

38 skills

@open-gsdInstall Plugin

A set of Claude Code skills for development workflows: reproducing bugs with regression checks, reviewing diffs and design against acceptance criteria, keeping documentation in sync before merge, and diagnosing local dev environment faults.

102 skills

@prismer-aiInstall Plugin

Professional design agency skillstack for 3D/WebGL, animation, and modern web development Claude Code plugin marketplace providing comprehensive coverage of modern web technologies including Three.js, GSAP, React Three Fiber, Framer Motion, Babylon.js, and.

23 skills

@freshtechbroInstall Plugin

Skills for a Claude Code agent that runs marketing work: answering questions about Meta ads performance, generating AI creator videos and images, and adding burned-in captions to finished vertical videos. Image and video generation runs through the GooseWorks fal proxy.

181 skills

@gooseworks-aiInstall Plugin

Gives text-only coding agents the ability to see: image question answering, OCR on long screenshots, restoring frontend UI from images, and GUI automation. It ships as local vision CLIs plus a skill, with optional integration for several coding agents.

1 skill

@anionexInstall Plugin

Generates and edits HTML slide decks in Claude Code and Codex, with design styles and export to PDF or per-slide PNG, plus card-news and image-based slide modes.

7 skills

@nomadamasInstall Plugin

Skills for working with video: video-scrub strips metadata and keeps only the picture and sound, video-shots breaks a finished video into a per-shot analysis table, and video-sync combines that shot data with the original video into a viewable file.

3 skills

@eternityspringInstall Plugin

Claude Code plugin for working with SEED, Daangn's design system: component and token guidance across React and Lynx, Chromatic snapshot diff triage, change impact and changeset writing, deprecation and migration notes, and SEED CLI setup help.

11 skills

@daangnInstall Plugin

Helps AI coding tools build, audit, debug and deploy Salesforce Agentforce agents, and trace live agent sessions to see what went wrong. Each job is handled by its own focused skill.

200 skills

@forcedotcomInstall Plugin

A shadcn/ui registry of animated React components with a shared motion system, including a hover highlight that glides between items. Useful for building interactive frontend interfaces.

1 skill

@mickadesignInstall Plugin

Gives AI coding tools Salesforce skills for building Agentforce agents, Flow, Apex, SOQL and Lightning apps, so they can build and debug those parts of an org with less hand-holding. Works with any AI tool that supports skills.

200 skills

@forcedotcomInstall Plugin

A Claude Code skill for reproducing a website from its real source code, covering static pages up to WebGL interactive demos. It walks through fetching the source, choosing a rebuild path, reverse-engineering it, and swapping in your own content.

1 skill

@jane-xiaoerInstall Plugin

A skill for Claude Code that plans a video through a series of guided questions, turning a rough idea into a standardized video-spec.md for rendering. Covers shot planning, pacing, captions, voiceover and transitions.

1 skill

@feicaiclubInstall Plugin

A Claude Code skill that lets you control sibling FanBox terminal windows: list, read, send commands, open new ones, and schedule recurring agent runs. Only available when the FANBOX_CTL environment variable is set.

1 skill

@alchaincyfInstall Plugin

A local-first AI research workbench for scientific work. It searches the literature, runs Python and R, queries scientific databases, and keeps figures, runs, decisions, and drafts together in one project.

27 skills

@xuzhougengInstall Plugin

A set of Claude Code skills for GSAP web animation, covering the core API, React and Vue/Svelte integration, plugins like ScrollTrigger and Flip, and performance tuning.

12 skills

@nexu-ioInstall Plugin

Builds complete web pages from scratch, from award-level product and marketing pages to cinematic scroll-driven sites and multi-screen products. A built-in linter flags generic, template-looking design before a page ships.

1 skill

@agiwhitelistInstall Plugin

OpenLoomi is an open-source AI coworker that connects your work tools, understands your context, and tells you what needs attention and what to do next. It runs local-first with skills for data analysis, persistent learning, and Composio app integrations.

28 skills

@melandlabsInstall Plugin

A design method toolkit for building and reviewing user interfaces in Claude Code. It applies consistent design tokens, layout choices, and rendered visual checks, and includes a skill for capturing approved design lessons locally.

2 skills

@bitjaruInstall Plugin

A skill that scans React Native code for Animated and Reanimated usage and migrates it to EaseView, the library's declarative animation component. Useful for developers moving existing animations onto platform-native APIs.

1 skill

@appandflowInstall Plugin

Skills for building React Native, Expo and React web interfaces with PanelUI components, theming and composed panels. Also includes tools for designing app logos and creating shieldcn-styled README badges.

6 skills

@panel-uiInstall Plugin

Automates recurring jobs in Claude Code, such as making Instagram-style card news, running a multi-AI plan, implement and review loop, scaffolding new Flutter projects, and removing watermarks from images.

20 skills

@bear2uInstall Plugin

Gives an AI agent a library of ready-made workflows for fetching feeds into a reading digest, polishing interview transcripts into readable articles, drawing Anthropic-style diagrams, and removing Gemini watermarks from images.

7 skills

@rookie-ricardoInstall Plugin

Generates complete presentation decks from a request, running the full workflow from research and outline to design and output as high quality HTML slides. Triggers when a user asks for a PPT, slides, a training deck, or a pitch deck.

1 skill

@sunbigflyInstall Plugin

Claude Code plugin with skills, agents, commands and MCP servers for orchestrating coding-agent CLIs, auditing plans against implementations, managing MCP servers, and running CSS design-token checks.

10 skills

@xiaolaiInstall Plugin

A skill that learns a brand's look from a URL, name, or screenshot and turns it into a complete design system, so components built by your AI assistant match that brand. Works with Claude Code and Codex.

1 skill

@dominikmartnInstall Plugin

A web-based cockpit interface for OpenClaw, with a Kanban board skill that lets Claude Code manage tasks, run workflows, handle proposals and configure the board through the Nerve server API.

1 skill

@daggerhashimotoInstall Plugin

Turn a photo of your handwriting into a real font (TTF/WOFF/WOFF2) - free, open source, no uploads, no credits. Draw your alphabet on paper. Take a photo. Get your font. This is a real one-shot result: dim light, spiral binding, page shadow.

1 skill

@danilo-znamerovszkijInstall Plugin

Turns a software change into a guided pipeline of written steps: a change proposal, a technical design comparing options, test-driven development, and architecture decision records. Each stage leaves an auditable document, so AI-assisted coding follows a repeatable process you can review.

25 skills

@dong90Install Plugin