← all plugins

Frontend & UI

curated by SkillMD · plugin · 31 skills

React, Vue, Svelte, CSS and component skills for building interfaces.

Install the whole plugin (CLI)
npx skillmds add agricidaniel/ads-report npx skillmds add clockless-org/html-anything npx skillmds add nextlevelbuilder/slides npx skillmds add petar-nauka/fact-check npx skillmds add jakubantalik/transitions-dev npx skillmds add maverickgao8848/mav-slidecraft-skill npx skillmds add heygen/figma npx skillmds add wangzan101/zan-html-to-ppt npx skillmds add dontbesilent2025/dbs-wechat-html npx skillmds add claude-skills/sveltekit-svelte5-tailwind-skill npx skillmds add kkkkhazix/storage-analyzer npx skillmds add oil-oil/grok-designer npx skillmds add op7418/guizang-ppt-skill npx skillmds add kaguratart/paper-to-course npx skillmds add nexu-io/deck-simple npx skillmds add yu-0312/ppt-creater-skill npx skillmds add voltagent/expo-design-analysis npx skillmds add leejpsd/typescript-react-nextjs-patterns npx skillmds add agricidaniel/ads-landing npx skillmds add majiayu000/ue npx skillmds add nextlevelbuilder/ui-styling npx skillmds add ecnu-icalk/xlsx npx skillmds add heygen/hyperframes-core npx skillmds add agentskillexchange/html-docs npx skillmds add leonxlnx/design-taste-frontend-v1 npx skillmds add remotion-dev/remotion-markup npx skillmds add iamanacarolinarezende/ui-page npx skillmds add ecnu-icalk/frontend-design npx skillmds add ecnu-icalk/jquery npx skillmds add tinh2/ui-craft npx skillmds add tinh2/dark-mode
⬇ Download

Skills in this plugin

  1. ads-report · agricidaniel
    Renders Markdown, HTML, or PDF paid-advertising reports from a validated Claude Ads JSON run bundle.
    2
    installs
  2. html-anything · clockless-org bundle
    Transforms ideas, files, folders, URLs, or exported data into polished single-file HTML pages with auto-selected design systems.
    136
    repo stars
  3. slides · nextlevelbuilder bundle
    Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
    9
    installs
  4. fact-check · petar-nauka bundle
    Verifies claims, articles, screenshots, and URLs through source-grounded analysis with an evidence ledger, source credibility evaluation, and manipulation detection. Supports quick checks, full fact-check cards, two-source comparisons, and prebunking in multiple languages and policy contexts.
    74
    repo stars
  5. transitions-dev · jakubantalik bundle
    Provides portable CSS transitions for common UI patterns like dropdowns, modals, tooltips, and skeleton loaders. Each transition is a drop-in snippet with semantic CSS custom properties and a prefers-reduced-motion guard.
    5
    installs
  6. mav-slidecraft-skill · maverickgao8848 bundle
    Create zero-dependency, animation-rich HTML presentations that run entirely in the browser, supporting new builds, PowerPoint conversion, or enhancements with strict viewport and design constraints.
    45
    repo stars
  7. figma · heygen bundle
    Import Figma designs into HyperFrames compositions as frozen assets, brand tokens, components, motion animations, and shaders.
    8
    installs
  8. zan-html-to-ppt · wangzan101 bundle
    Converts HTML slide decks into offline PDF and image-based PPTX files using Playwright screenshots, preserving visual fidelity.
    33
    repo stars
  9. dbs-wechat-html · dontbesilent2025 bundle
    Converts Markdown into HTML formatted for WeChat Official Account publishing, with 15 built-in styles.
    6
    installs
  10. sveltekit-svelte5-tailwind-skill · claude-skills bundle
    Guides building sites with SvelteKit 2, Svelte 5, and Tailwind CSS v4, covering setup, runes, forms, styling, deployment, and migration through curated documentation and a structured search workflow.
    30
    repo stars
  11. storage-analyzer · kkkkhazix bundle
    Scans macOS or Windows disk usage with read-only commands, categorizes large items into auto-cleanable, manual-review, and cautious tiers, and generates an interactive HTML report with one-click deletion via a local web server.
    7
    installs
  12. grok-designer · oil-oil bundle
    Delegates UI, UX, and visual design tasks to Grok 4.5 through a dedicated CLI, covering critique, art direction, HTML mockups, and SVG assets.
    57
    repo stars
  13. guizang-ppt-skill · op7418 bundle
    Generates a single-file horizontal-scroll web PPT with WebGL backgrounds, section covers, data hero cards, and image grids in two visual styles: 'e-magazine × e-ink' or 'Swiss International Style'.
    6
    installs
  14. paper-to-course · kaguratart bundle
    Converts academic papers into interactive HTML courses, Markdown documents, and PPTX presentations in a single run.
    29
    repo stars
  15. deck-simple · nexu-io bundle
    Creates a clean horizontal-swipe HTML deck for pitches, overviews, or study materials with cover, content pages, progress bar, and keyboard navigation.
    8
    installs
  16. ppt-creater-skill · yu-0312 bundle
    Turns messy documents, meeting transcripts, reports, or raw data into a polished, design-conscious HTML presentation through a structured workflow that filters content, defines style specs, and generates slides, with optional theme research and cross-session resume support.
    26
    repo stars
  17. expo-design-analysis · voltagent bundle
    Documents the visual design system of Expo's marketing site, including color palette, typography, layout, and component styles for consistent brand implementation.
    50.9k
    repo stars
  18. typescript-react-nextjs-patterns · leejpsd bundle
    Provides production-grade TypeScript guidance for React and Next.js, covering type narrowing, component props, generics, runtime validation, data fetching, state management, performance, accessibility, and code review.
    18
    repo stars
  19. ads-landing · agricidaniel
    Audit paid-ad landing pages for message match, mobile experience, performance, accessibility, trust, forms, consent, tracking, security, and conversion friction.
    4
    installs
  20. ue · majiayu000 bundle
    Defines end-to-end user experience behavior and interaction logic, covering flow design, state machines, error recovery, validation, accessibility, and testable acceptance criteria.
    567
    repo stars
  21. ui-styling · nextlevelbuilder bundle
    Create beautiful, accessible user interfaces with shadcn/ui components, Tailwind CSS utility-first styling, and canvas-based visual designs.
    12
    installs
  22. xlsx · ecnu-icalk bundle
    Creates, edits, and analyzes spreadsheet files using pandas and openpyxl, with formula recalculation via LibreOffice.
    559
    repo stars
  23. hyperframes-core · heygen bundle
    Build a single renderable HyperFrames composition using HTML with data-* timing attributes, clips, tracks, sub-compositions, variables, and deterministic rendering rules.
    7
    installs
  24. html-docs · agentskillexchange
    Turns folders, codebases, websites, PDFs, documents, and research topics into source-grounded HTML documents, narrated videos, or learning courses; publishes and revises collaborative HTML pages via CLI, REST API, and MCP server.
    28
    repo stars
  25. design-taste-frontend-v1 · leonxlnx
    Generates premium React/Next.js frontend code with deterministic typography, calibrated color palettes, and motion physics, enforcing anti-cliché design rules and performance guardrails.
    4
    installs
  26. remotion-markup · remotion-dev bundle
    Guidance for writing Remotion React markup with animation patterns, media handling, sequences, effects, and advanced features like 3D, audio visualization, and parameterized videos.
    3.9k
    repo stars
  27. ui-page · iamanacarolinarezende
    Scaffolds a new mobile-first page using StyleSeed Toss layout patterns, section rhythm, and existing shell components.
    0
    repo stars
  28. frontend-design · ecnu-icalk bundle
    Builds distinctive, production-grade frontend interfaces with bold aesthetics, avoiding generic AI design patterns.
    559
    repo stars
  29. jquery · ecnu-icalk
    Renders table cells with a red-to-green background gradient based on numeric values (0-100) using jQuery and chroma.js, skipping non-numeric content.
    559
    repo stars
  30. ui-craft · tinh2
    Polishes UI primitives one at a time using research-backed patterns: adds loading and icon states to buttons, replaces inline skeletons with primitives, adds secondary actions to errors, ensures 48px touch targets and visible focus indicators, and applies a standard motion token ladder.
    13
    repo stars
  31. dark-mode · tinh2
    Adds a complete dark mode to any frontend project: auto-detects the theme system, generates a WCAG-compliant dark palette, adds a toggle with system detection and persistence, migrates hardcoded colors to theme tokens, and verifies contrast ratios.
    13
    repo stars