232 Claude Code skills tagged Svelte. Browse all topic-related skills in the open ClaudSkills registry — free to install, one-click via the desktop app.
Showing top 200 of 232 skills, ranked by quality score.
Type-safe API design: Zod validation, Result types, SvelteKit endpoints, middleware patterns.
engineering
Frontend styling: layout debugging, style consistency, CSS best practices for Svelte/SvelteKit.
engineering
Pragmatic testing with Vitest: risk-based strategy, Svelte component testing, test-after development.
engineering
Svelte 5 and SvelteKit: runes reactivity, component composition, routing, data loading, form handling. — from JasonWarrenUK/goblin-mode
engineering
Svelte 5 and SvelteKit: runes reactivity, component composition, routing, data loading, form handling. — from JasonWarrenUK/goblin-mode
engineering
Validate code against accessibility standards: WCAG 2.1 Level AA, EN 301 549, and the European Accessibility Act (EAA / Directive EU 2019/882). Covers semantics, text alternatives,
product
Standalone post-generation QA pass that lints any frontend output (HTML/JSX/Vue/Svelte/CSS) against the named anti-pattern catalogue and proposes specific rewrites with severity ra
engineering
Clone any website with a coordinated team of AI agents — a Manager (you), a Frontend Developer, a Backend Architect, and a Tester — that iteratively and autonomously build a pixel-
engineering
Use when adding state management to a module - creates Svelte store with server state integration.
engineering
Guide for integrating modern web frameworks with Capacitor. Covers Next.js static export, React, Vue, Angular, Svelte, and others. Use this skill when converting framework apps to
engineering
Implement or refactor Next.js frontend features with Tailwind and Skeleton UI. Covers App Router, Server Components, Server Actions, Skeleton themes and components, layout patterns
engineering
Convert an exported Claude artefact (HTML or JSX) into a working Svelte 5 / SvelteKit 2 project
tools
Use when switching a project or component between frameworks - React to Vue, Vue to Svelte, or any supported framework pair.
engineering
Validate code against SEO best practices: W3C semantics, meta/OG tags, Schema.org, hreflang, Core Web Vitals (LCP/INP/CLS), resource hints, GEO, SPA/SSG/CSR crawlability, technical
growth
Comprehensive Svelte 5 assistant — component generation with runes syntax, code review, debugging, and SvelteKit patterns. Use when working with .svelte files or Svelte/SvelteKit p
engineering
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from si
product
Accessibility audit skill for scanning, fixing, and verifying WCAG 2.2 Level A and AA compliance across React, Next.js, Vue, Angular, Svelte, and plain HTML codebases. Use when aud
product
Automated WCAG 2.1 AA accessibility testing with axe-core and Lighthouse CI. Auto-detects frontend framework (React, Next.js, Vue, Angular, Svelte, Astro, Flutter, React Native), d
product
Adds a generation parameter across MooshieUI's Svelte store, TypeScript types, Rust GenerationParams, and workflow templates. Use for new UI settings, ComfyUI inputs, or /add-gener
engineering
Add the Shaders WebGPU mouse effect used for the Tidal Commons hero: a white twinkling halftone cursor trail driven by ChromaFlow, masked through a DotGrid, finished with chromatic
product
Build full-stack web applications with SvelteKit — file-based routing, SSR, SSG, API routes, and form actions in one framework. Use when you need help with sveltekit. — from anubha
engineering
UI/UX design intelligence for web and mobile: style selection, color systems, typography, layout, accessibility, interaction states, responsive behavior, forms, charts, design syst
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from si
product
Builds accessible UI components with Ark UI headless primitives for React, Vue, Solid, and Svelte. Use when creating custom-styled components with robust state management and acces
product
Production frontend craftsman for React/Vue/Svelte. Handles hooks design, state management, Server Components, form handling, and data fetching. Converts Forge prototypes to produc
product
Astro is a modern web framework for building content-driven websites. It ships zero JavaScript by default, supports multiple UI frameworks (React, Vue, Svelte, Solid), and provides
content
Astro framework specialist for building fast, content-driven websites with islands architecture. Use when creating Astro components, configuring hydration (client:load/idle/visible
engineering
Expert Astro UI framework integrations — @astrojs/react, @astrojs/vue, @astrojs/svelte, @astrojs/solid-js, @astrojs/preact, @astrojs/alpinejs, @astrojs/lit, @qwikdev/astro, @analog
engineering
Use when building content-heavy sites with Astro, deciding between SSG/SSR/hybrid, choosing client directives (idle/visible/load/media), structuring content collections with type-s
engineering
Astro 5/6 islands architecture expert with multi-framework selection (React, Svelte, Vue, SolidJS). Use when building or modifying Astro sites, adding interactive components, choos
engineering
Gunakan skill ini saat bekerja dengan frontend QuantLab (Astro 5, Svelte 5 Runes, shadcn-svelte, SciChart.js, Tailwind v4). Mencakup: tambah komponen, buat halaman baru, integrasi
engineering
Zero-config animations for React, Vue, Solid, Svelte, Preact with @formkit/auto-animate (3.28kb). Prevents 15 documented errors including React 19 StrictMode bugs, SSR imports, con
engineering
Zero-config animations for React, Vue, Solid, Svelte, Preact with @formkit/auto-animate (3.28kb). Prevents 15 documented errors including React 19 StrictMode bugs, SSR imports, con
engineering
Accessibility testing and remediation using the axe MCP Server. Use when creating or modifying UI code (HTML, JSX, TSX, Vue, Svelte, CSS) to ensure accessibility compliance. Trigge
product
XBG Boilerplate SvelteKit — master reference for the SvelteKit 5 boilerplate project
tools
Svelte-first frontend experience engineering. Use when building interactive experiences: animations, 3D/WebGL, scrollytelling, data visualization, or any visual/interactive work. C
engineering
Use when building or running SvelteKit apps on Bun, including SSR, adapters, and Bun-specific APIs — from engineering/frontend
engineering
Use when building or running SvelteKit apps on Bun, including SSR, adapters, and Bun-specific APIs — from engineering/frontend
engineering
Build Chrome extensions using WXT framework with TypeScript, React, Vue, or Svelte. Use when creating browser extensions, developing cross-browser add-ons, or working with Chrome W
engineering
Enforces the use of classes for complex state management (state machines) in Svelte components. Applies specifically to `.svelte.ts` files.
engineering
Expert guidance for deploying TypeScript SvelteKit apps to Cloudflare Workers (edge) with D1. Use when configuring @sveltejs/adapter-cloudflare, Wrangler config, Workers Assets, D1
engineering
Framework integration for Cloudflare Workers. Use when building with Hono, Remix, Next.js, Astro, SvelteKit, Qwik, or Nuxt on Workers. Covers routing, SSR, static assets, and edge
engineering
Reverse-engineer any codebase into a complete Product Requirements Document (PRD). Analyzes routes, components, state management, API integrations, and user interactions to produce
product
Comark (Components in Markdown) parser — syntax, AST, Vue/React/Svelte renderers, plugins, and LLM streaming with auto-close.
engineering
Generate a UI component scaffold in the codebase's actual style. Reads dragoon.json to match framework (react/vue/svelte), styling layer (tailwind/css-modules/plain), language (typ
engineering
Generates starter component code using design tokens. Creates React/Vue/Svelte components with proper token usage, variants, and accessibility built in.
tools
Vitest browser mode component testing. Use for testing Svelte 5 components with real browsers, locators, accessibility patterns, and reactive state.
engineering
Data visualization and chart components for Composable Svelte. Use when creating charts, graphs, or data visualizations. Covers chart types (scatter, line, bar, area, histogram), d
engineering
Streaming chat and collaborative features for Composable Svelte. Use when implementing LLM chat interfaces, real-time messaging, or collaborative features. Covers StreamingChat (tr
engineering
Code editing, syntax highlighting, and visual programming for Composable Svelte. Use when implementing code editors, syntax highlighting, or node-based visual programming. Covers C
engineering
UI component library reference for Composable Svelte. Use when implementing designs, choosing components, styling layouts, or working with shadcn-svelte components. Covers componen
engineering
Core architecture patterns for Composable Svelte. Use when creating stores, writing reducers, working with effects, composing reducers, or implementing business logic. Covers the S
engineering
Production deployment patterns for Composable Svelte SSR applications. Use when deploying to Fly.io, Docker, or any cloud platform. Covers multi-stage Docker builds, Fly.io configu
engineering
Form patterns and validation for Composable Svelte. Use when building forms, validating user input, or integrating Zod schemas. Covers FormConfig, createFormReducer, field-level va
engineering
3D graphics and WebGPU/WebGL rendering with Composable Svelte. Use when building 3D scenes, working with cameras, lights, meshes, materials, or implementing WebGPU/WebGL graphics.
engineering
Internationalization (i18n) system for Composable Svelte. Use when implementing multi-language support, translations, date/number formatting, locale detection, or localizing applic
engineering
Audio, video, and voice components for Composable Svelte. Use when implementing audio players, video embeds, or voice input. Covers AudioPlayer (Web Audio API), VideoEmbed (YouTube
engineering
Navigation and animation patterns for Composable Svelte. Use when implementing modals, sheets, drawers, alerts, navigation flows, or component lifecycle animations. Covers state-dr
engineering
Server-side rendering patterns for Composable Svelte. Use when implementing SSR, hydration, server rendering, isomorphic code, or working with meta tags and SEO. Covers renderToHTM
engineering
Testing patterns for Composable Svelte. Use when writing tests, using TestStore, mocking dependencies, or testing reducers and effects. Covers the send/receive pattern, mock implem
engineering
Fetch up-to-date library documentation via Context7 REST API. Use when needing current API docs, framework patterns, or code examples for any library. Use when user asks about Reac
engineering
Generate an offline-first Progressive Web App with Odoo Studio backend integration. Use when user wants to create new Odoo-backed application, mentions "PWA with Odoo", "offline Od
engineering
CRXJS Chrome extension development — true HMR for popup, options, content scripts, side panels, manifest-driven builds, dynamic content script imports (`?script`, `?script&module`)
tools
Full Sentry SDK setup for Svelte and SvelteKit. Use when asked to \"add Sentry to Svelte\", \"add Sentry to SvelteKit\", \"install @sentry/sveltekit\", or configure error monitorin
engineering
Master Cypress component testing, React/Vue/Svelte mounting, component isolation, custom command creation, network stubbing, and visual snapshot assertions. Trigger when building o
engineering
Design, implement, audit, and plan interface animation and motion systems. Use for animation reviews, motion audits, easing and duration decisions, gesture physics, transform origi
science
Modern UI design principles and guidelines for building clean, professional interfaces. Use when creating any UI components, layouts, web pages, or interactive elements including b
engineering
UI/UX design intelligence for web and mobile. Searchable local database with 84 styles, 192 color palettes, 74 font pairings, 192 product types, 98 UX guidelines, 104 icon entries,
product
Crée des composants React/Vue/Angular/Svelte optimisés et réutilisables. Se déclenche avec "composant React", "component", "Vue component", "Angular component", "Svelte" — from eng
engineering
Développement d'applications Svelte et SvelteKit avec réactivité native, stores, SSR, routing et transitions. Se déclenche avec "Svelte", "SvelteKit", "store Svelte", "ré — from en
engineering
前端 GlitchTip 错误追踪接入技能。凡是用户提到 GlitchTip、Sentry SDK、前端错误聚合、Source Map 上传、JS 错误追踪、Issue 管理时触发。框架无关，支持 Vue/React/Angular/Svelte/原生 JS。
science
前端 SkyWalking RUM 接入技能。凡是用户提到前端监控、RUM、skywalking-client-js、Web Vitals 采集、浏览器端链路追踪、前端错误上报时触发。框架无关，支持 Vue/React/Angular/Svelte/原生 JS。
science
Dial in interface parameters of any kind — add live, tweakable controls (dials/knobs/sliders/timelines) to a UI so values like animation timing, spacing, colors, and physics can be
science
通过 Context7 MCP 获取库和框架的实时最新文档，而非依赖训练数据，防止 API 幻觉。适用于查询任何库或框架的用法、配置、示例代码。触发词：怎么用、怎么配置、API参考、文档、示例代码、用法、接口、库文档、框架文档、documentation、docs、how to use、API reference、setup、configure、React怎
engineering
Look up CE.SDK Svelte reference docs, guides, and configuration pages.
engineering
Look up CE.SDK SvelteKit reference docs, guides, and configuration pages.
engineering
GLATasks の e2e テスト（Playwright）実装リファレンス。 `app/tests/` 配下のテストファイルを編集するとき、または SvelteKit の hydration パターン・ ダイアログ操作・マルチブラウザ同期テスト・SSE 制御を扱うときに呼び出す。
engineering
Audit and fix SEO for any web app. Checks meta tags, Open Graph and Twitter Card tags, JSON-LD structured data, robots.txt, sitemap.xml, canonical URLs, heading hierarchy, internal
science
FilePond is a JavaScript file upload library that handles files, directories, URLs, and Data URIs with drag-and-drop, paste, and API support. It includes built-in image optimizatio
engineering
Flowbite Svelte component documentation lookup. MUST be used whenever creating or editing UI components that use Flowbite Svelte. Fetch component docs before writing any Flowbite c
engineering
Framework-specific accessibility patterns and fix templates for React, Vue, Angular, Svelte, Next.js, and Tailwind CSS.
product
Conventions for a client-side SPA or SSG that consumes APIs it does not own. Use when .claude/HARNESS.toml selects web/frontend-app, or when building a React/Vue/Svelte app with a
engineering
Frontend best practices — TypeScript, React/Vue/Svelte, CSS, accessibility, testing. Use when writing, reviewing, or discussing frontend code.
product
Systematic 10-phase debugging procedure for SvelteKit 2 + Svelte 5 frontend issues. Use when components fail to render, routing breaks, runes throw errors, or Encore client calls f
engineering
Fix generic Svelte component designs by applying aesthetic upgrades across the 5 design dimensions (typography, color, motion, spatial composition, backgrounds)
engineering
Create distinctive, production-grade Svelte/TypeScript frontends with exceptional design quality
engineering
Professional frontend standards for building, scaffolding, extending, or reviewing any UI or frontend project — new or existing — even when standards aren't explicitly asked for. K
engineering
Frontend UI/UX work with Gemini CLI in --yolo mode. Use when (1) modifying visual/styling elements in frontend files (.tsx, .jsx, .vue, .svelte, .css), (2) implementing UI componen
engineering
Interactive multi-level skill for scaffolding frontend projects from source. Use when user wants to: (1) Create a new frontend project (web, mobile, desktop, or cross-platform) (2)
product
Frontend state quality checklist for React, Vue, Svelte, stores, side effects, forms, and data fetching.
engineering
Feature-Sliced Design (FSD) v2.1 공식 문서를 Progressive Disclosure 방식으로 제공하는 지식 스킬. 레이어/슬라이스/세그먼트, Public API, cross-imports, v2.0→v2.1 pages-first 마이그레이션, Next.js·NuxtJS·React Query·S
product
Framework-agnostic guide for implementing stable, semantic selectors in any web application. Solves the dynamic class name problem caused by CSS-in-JS, CSS Modules, and build tools
content
Review the working tree before committing to Git. Triggers on: the user asks to commit or push, a large task is complete, or a PR is about to be created. Rules: ensure `svelte-chec
engineering
GitButler is a modern Git client built in Rust and Svelte that introduces virtual branches, allowing developers to work on multiple branches simultaneously without stashing or swit
engineering
Official GSAP skill for Vue, Svelte, and other non-React frameworks — lifecycle, scoping selectors, cleanup on unmount. Use when the user wants animation in Vue, Nuxt, Sv — from Tu
engineering
Integrate Heartwood authentication into a new or existing Grove property. Covers client registration, PKCE OAuth flow, SvelteKit route setup, session validation, and wrangler confi
engineering
Official GSAP skill for Vue, Svelte, and other non-React frameworks — lifecycle, scoping selectors, cleanup on unmount. Use when the user wants animation in Vue, Nuxt, Sv — from on
engineering
Frontend UI/UX design intelligence - activate FIRST when user requests beautiful, stunning, gorgeous, or aesthetic interfaces. The primary skill for design decisions before impleme
product
Build modern SPAs with Inertia.js and Rails using React, Vue, or Svelte. Use when creating Inertia pages, handling forms with useForm, managing shared props, or implementing client
engineering
Configuring JavaScript frontend frameworks for Tauri v2 desktop apps (Next.js, Nuxt, Qwik, SvelteKit, Vite) with SSG setup and tauri.conf.json settings. USE WHEN integrating a JS f
engineering
Ensure iOS/iPadOS-friendly form inputs (keyboard type, inputmode, autocomplete, autocapitalize/autocorrect, enterkeyhint) when editing or reviewing UI forms in web apps. Use when a
engineering
Write and run JavaScript/TypeScript tests using Vitest or Jest with mocking, component testing, and coverage. Use when writing JS/TS tests, testing Svelte/React components, or sett
engineering
Use when editing ESLint, Prettier, Stylelint, PostCSS, or Svelte config files. Use when adding or removing linting plugins, resolving formatter conflicts, auditing JS/TS toolchain
tools
json-render component catalog patterns for AI-safe generative UI. Define Zod-typed catalogs that constrain what AI can generate, use @json-render/shadcn for 36 pre-built components
engineering
UI/UX design intelligence and implementation guidance for building polished interfaces. Use when the user asks for UI design, UX flows, information architecture, visual style direc
product
LLM knowledge cutoff compensator — knowledge corrections for breaking changes and API drift. Covers: renamed packages (shadcn-ui→shadcn), changed APIs (z.string().email()→z.email()
tools
Build, run, debug, test, and deploy the koi pond showcase — a host pond that composites independently-implemented framework koi apps (React/Vue/Svelte/Solid/Preact/Lit/Angular/vani
engineering
Phase 2 of the Launchgrade workflow — takes the approved single-HTML draft (index.html from launchgrade-design) and brings it into production shape. Stack choice happens here (plai
security
Expert guide for Layer Cake, a headless Svelte visualization framework managing scales, dimensions, and data flow while supporting SVG, Canvas, HTML, and WebGL rendering contexts f
engineering
Expert guide for LayerChart, a Svelte component library for building diverse data visualizations (Cartesian, radial, hierarchical, geo, graph) with unopinionated building blocks, m
engineering
LayerChart Svelte 5 patterns. Use for chart components with tooltip snippets, Chart context access, and all Svelte 5 snippet patterns for tooltips, gradients, highlights, and axes.
engineering
Complete Better Auth documentation in markdown format. Use when implementing authentication in TypeScript projects - covers OAuth providers (Google, GitHub, etc.), email/password,
engineering
Use when adding, reviewing, or fixing localized UI copy in agentsview's Svelte frontend with Paraglide JS. Trigger for frontend/messages/*.json edits, generated m.* message usage,
engineering
Search, fetch, and integrate free Lottie animations into React, React Native, Vue, Svelte, Angular, Flutter, and Vanilla web projects. Use when the user asks for any Lottie/dotLott
growth
Augment a sprint's SPEC.md with a Frontend section (component tree, state, a11y, routing, performance budget, Playwright e2e plan) tailored to the project's stack (React/ — from en
engineering
Install and wire markstream-vue, markstream-react, markstream-vue2, markstream-angular, or markstream-svelte into an existing repository. Use when Codex needs to choose the right p
engineering
Integrate the beta markstream-svelte renderer into Svelte 5 or SvelteKit with runes, explicit CSS, smooth streaming, workers, and SSR-safe boundaries.
engineering
markuplint is a comprehensive HTML linter designed for all markup developers. It enforces accessibility, spec compliance, and best practices across HTML, JSX, Vue, Svelte, Astro, P
tools
Scaffolds MCP App project structure with correct directory layout, dependencies, entry points, and framework-specific templates. Handles React (useApp hook), Vanilla JS, Vue, Svelt
engineering
Central message routing for Photino.NET: {type,payload} format, HandleMessage dispatch, Send helper, event wiring, Svelte 5 component patterns, IAsyncDisposable in sync contexts. P
engineering
Mitosis lets you write UI components once and compile them to React, Vue, Angular, Svelte, Solid, Qwik, and more. Built by Builder.io, it enables maintaining a single component cod
engineering
Creates 120fps GPU-accelerated animations with Motion.dev (Framer Motion successor) for React, Next.js, Svelte, and Astro projects. Use when user requests animation, motion, scroll
growth
Guide for deploying web frameworks on Netlify. Use when setting up a framework project (Vite/React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, Remix) for Netlify de — from ja
engineering
Use when implementing the vanilla-JS single-page frontend served by a Node Web Only backend from public/ - covers HTML structure, vendored self-hosted fonts, Catppuccin Mocha theme
engineering
Guide for deploying web frameworks on Netlify. Use when setting up a framework project (Vite/React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, Remix) for Netlify de — from ph
engineering
Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues); client libraries and S — from ph
engineering
Generate type-safe API clients, TanStack Query/SWR hooks, Zod schemas, MSW mocks, Hono server handlers, MCP servers, and SolidStart actions from OpenAPI specs using Orval. Covers a
engineering
Integrate Outlit SDK for customer context for agents. Triggers when users need to add Outlit to any web framework (React, Next.js, Vue, Nuxt, Svelte, Angular, Astro), server runtim
engineering
\"Run tests for Photino.NET project with filter patterns, coverage collection, and frontend type checking. 運行Photino.NET工程測試：過濾模式、覆蓋率收集及前端類型檢查. Use when: running unit tests, filter
engineering
Web-to-native porting design specialist (2026 spec — Liquid Glass / Material 3 Expressive / Swift 6.2 / Compose 1.7+ / Xcode 26 / targetSdk 36 / 16KB page / Passkey / Privacy Manif
product
Render and serialize Portable Text to React, Svelte, Vue, Astro, HTML, Markdown, and plain text. Use when implementing Portable Text rendering in any frontend framework, building c
engineering
Use when you need to visually see a real Svelte webview component of the Claude Todos panel (a screenshot), not just run tests or the build — e.g. confirming a UI change under src/
engineering
Use when asked for framework-specific best practices, implementation guidelines for React/Vue/Svelte/Next.js, or stack-specific patterns. Examples: "React best practices", "Vue com
engineering
Svelte 5 runes, SvelteKit routing, reactive components, stores, and modern Svelte ecosystem best practices. Auto-activates in Svelte projects.
engineering
Crée des composants React/Vue/Angular/Svelte optimisés et réutilisables. Se déclenche avec "composant React", "component", "Vue component", "Angular component", "Svelte" — from eng
engineering
Use when working with rEFui (refui) applications where you cannot rely on reading the library source. Covers the retained-mode + signals mental model, DOM/HTML/Reflow renderers, JS
engineering
Remult patterns - entities, fields, repo() usage, lifecycle hooks, permissions (allowApi + apiPrefilter), upsert, customFilter, sqlExpression, ValueList enums, relations. Use whene
engineering
Review code for logging patterns and suggest evlog adoption. Guides setup on Nuxt, Next.js, SvelteKit, Nitro, TanStack Start, React Router, NestJS, Express, Hono, Fastify, Elysia,
engineering
Use when given a Figma file URL + node-id and asked to generate frontend scaffold code (Vue/React/Svelte) that matches an existing project's design system tokens. Verified pipeline
engineering
Full Sentry SDK setup for Svelte and SvelteKit. Use when asked to "add Sentry to Svelte", "add Sentry to SvelteKit", "install @sentry/sveltekit", or configure error monitoring, tra
engineering
Use on day 1 of a project to ship sitemap, robots.txt, OG image, and JSON-LD schema in a single PR. Auto-detects Next.js, Astro, or SvelteKit, audits what's already there, and only
growth
Create and initialize Tauri v2 cross-platform desktop and mobile projects, covering prerequisites, create-tauri-app or manual CLI setup, directory structure, and config. USE WHEN s
engineering
Use when adding, using, or customizing shadcn-svelte components in a Svelte or SvelteKit project, or when you need to look up component APIs, install commands, or underlying packag
engineering
Generate comprehensive Spanish README.md documentation for Svelte 5 projects with Mermaid diagrams. Use when art-vandeley detects a Svelte/SvelteKit codebase. Creates architecture
engineering
Use when a task involves reading, editing, reviewing, testing, debugging, refactoring, or otherwise working with source code files. Source paths include **/*.{py,ts,tsx,js,jsx,mjs,
engineering
Design reusable, composable UI components with single responsibility, clear prop interfaces, and encapsulation. Apply when creating or modifying React, Vue, Svelte, or web componen
engineering
Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions. Always respects prefers-reduced-motion.
engineering
Master entry point for all Stitch design workflows. Routes from user request → design spec → prompt assembly → screen generation → iteration (edit, variants, design systems) → desi
growth
Converts Stitch designs into Svelte 5 / SvelteKit components using the runes API — scoped CSS with custom properties, built-in transitions, TypeScript, dark mode, and accessible ma
engineering
Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues); client libraries and S — from bg
engineering
Svelte and SvelteKit development with built-in reactivity, stores, SSR/SSG, and modern web patterns.
engineering
Svelte 5 and SvelteKit development with shadcn-svelte components and Bits UI patterns. Use when building Svelte components, working with runes ($state, $derived, $effect), using sh
engineering
Svelte 5 runes, component patterns, stores, transitions, and SvelteKit routing. Use when writing or reviewing Svelte code.
engineering
Svelte 5 development with runes ($state, $derived, $effect), SvelteKit full-stack framework, and modern reactive patterns. Use when building Svelte applications, implementing fine-
engineering
Expert Svelte/SvelteKit development assistant for building components, utilities, and applications. Use when creating Svelte components, SvelteKit applications, implementing reacti
engineering
Build node-based editors, interactive diagrams, and flow visualizations using Svelte Flow. Use when creating workflow editors, data flow diagrams, organizational charts, mindmaps,
engineering
Svelte and SvelteKit development — runes, stores, server-side rendering, form actions, streaming
engineering
Svelte coding guidelines for the Windmill frontend. MUST use when writing or modifying code in the frontend directory.
engineering
Développement d'applications Svelte et SvelteKit avec réactivité native, stores, SSR, routing et transitions. Se déclenche avec "Svelte", "SvelteKit", "store Svelte", "ré — from en
engineering
Svelte 5 and SvelteKit development patterns — runes, stores, server-side rendering, form actions, edge deployment
engineering
Run the three SvelteKit review agents (correctness, Svelte 5 idiom + UI conventions, abstraction) over a feature segment in apps/moderator, apps/auth or apps/creator-studio, and co
engineering
Expert guide for Svelte 5 (Runes) and SvelteKit 2+ — fine-grained reactivity, server-first architecture, form actions, and SSR/SSG / Panduan ahli Svelte 5 (Runes) dan SvelteKit 2+
engineering
Svelte 5 runes, snippets, SvelteKit patterns, and modern best practices for TypeScript and component development. Use when writing, reviewing, or refactoring Svelte 5 components an
engineering
Analyze a React/Next/Vue/Nuxt/Angular/Svelte-4 project and report what migrating to Svelte 5 + SvelteKit would actually buy — measured bundle reduction, dependencies eliminated by
engineering
Svelte 5 runes guidance. Use for reactive state, props, effects, or Svelte 4→5 migration. Covers $state, $derived, $effect, $props, $bindable. Prevents mixing syntaxes and reactivi
engineering
Svelte 5 runes + SvelteKit adapter-static (SSG/SSR) patterns for hydration-safe state, store bridges, and reactivity that survives prerendering
engineering
Build full-stack web applications with SvelteKit — file-based routing, SSR, SSG, API routes, and form actions in one framework. — from suhaibjanjua
engineering
Builds applications with SvelteKit including routing, load functions, form actions, hooks, and adapters. Use when creating Svelte applications with SSR, building full-stack apps, o
engineering
Complete architecture patterns, state management with Svelte 5 Runes ($state, $derived, $effect, $props), SvelteKit SSR/streaming pipelines, form actions, and production anti-patte
engineering
SvelteKit data flow guidance. Use for load functions, form actions, and server/client data. Covers +page.server.ts vs +page.ts, serialization, fail(), redirect(), error().
engineering
Optimize SvelteKit applications by leveraging SvelteKit's full-stack architecture for instant server-side rendering and progressive enhancement. Specialized in load functions, form
engineering
Guides SvelteKit progressive-enhanced forms so saves persist in UI without a manual refresh: use update({ reset:false }), applyAction for cross-route POSTs, and checkbox/select sta
engineering
SvelteKit remote functions guidance. Use for command(), query(), form() patterns in .remote.ts files.
engineering
SvelteKit structure guidance. Use for routing, layouts, error handling, SSR, or svelte:boundary. Covers file naming, nested layouts, error boundaries, pending UI, and hydration.
engineering
Scaffold and configure a production-ready SvelteKit PWA with opinionated defaults. Use when: creating a new web application, setting up a SvelteKit project, building a PWA, or when
engineering
Provides comprehensive Tailwind CSS utility-first styling patterns including responsive design, layout utilities, flexbox, grid, spacing, typography, colors, and modern CSS best pr
engineering
Debug Svelte TanStack Query v5/v6 stale data, SSR, stores, runes, and invalidation.
engineering
Implement Svelte TanStack Query v5/v6 with runes, keys, SSR, mutations, and invalidation.
engineering
Architectural patterns, security IPC, performance optimization, native integration, and production best practices for building cross-platform desktop applications using Tauri (v2)
engineering
Trigger: tech stack, preferred tools, SvelteKit, Bun, Drizzle, Zero Sync, Better Auth, Vite. Scope: Project tooling preferences, framework selections. Boundary: Excludes applicatio
engineering
Expert guidance for Wails, the Go framework for building desktop applications with web frontends. Helps developers build lightweight, fast desktop apps where the backend is Go and
engineering
Fix and create Svelte 5 tests with vitest-browser-svelte and Playwright. Use when fixing broken tests, debugging failures, writing unit/SSR/e2e tests, or working with vitest/Playwr
engineering
Tolgee is an open-source localization platform that lets developers and translators manage translations through in-context editing, machine translation integration, and SDKs for Re
content
对比原版 TS renderer 组件（`../claude-devtools/src/renderer/`）与 Rust 版 Svelte 组件（`ui/src/`）的功能 / 样式 / 交互差距，输出差异报告 + 移植建议。**仅**用户显式 `/ts-ui-compare <组件名>` 时触发——模型不能自主调用，因为这是一个需要逐文件细读的开销大动作
engineering
Use when implementing a UI brief on a stack with no framework executor — Svelte, Astro, Angular, plain HTML. Carries the stack-independent contract; idiom comes from the stack corp
engineering
Wire agents into React, Vue, and Svelte frontends with streaming hooks, and set up server-side Next.js App Router or Express API routes using AgentStream.toSSE().
engineering
UI/UX design intelligence for web and mobile. Searchable local database with 85 styles, 193 color palettes, 74 font pairings, 192 product types, 98 UX guidelines, 104 icon entries,
product
[METHODOLOGY] UI/UX design intelligence database (50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, 25 chart types across 10 stacks — React, Ne
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: — from bg
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from bg
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from bg
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from sa
product
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui — from di
product
面向设计团队和企业项目的专业级UI/UX设计决策引擎,涵盖全部10个设计域、 10种技术栈、设计系统持久化、页面级覆盖、批量搜索等高级能力。核心能力: - 全部10个设计域搜索(product/style/typography/color/landing/chart/ux/react/web/prompt) - 10种技术栈实现指引(html-tailwin
product
Help users add icons to their projects using the Unicon icon library. Unicon provides 19,000+ icons from Lucide, Phosphor, Hugeicons, Heroicons, Tabler, Feather, Remix, Simple Icon
engineering
Answer questions about better-auth and help build authentication features. Use when developers: (1) ask about better-auth APIs like `betterAuth`, `auth.api.*`, `authClient.*`; (2)
security
UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (R
product
Community skill for applying the Geist design system to Vercel-inspired rendered frontend UI across React/Next.js/Vite/Astro/Svelte/Vue/HTML/CSS, Tailwind, shadcn, and Radix. Use f
product
Use for Vercel cost and performance optimization on deployed projects, especially Next.js, SvelteKit, Nuxt, and limited Astro apps. Collect Vercel metrics, usage, project config, a
engineering
Master React, Vue, and Svelte component patterns including CSS-in-JS, composition strategies, and reusable component architecture. Use when building UI component libraries, designi
engineering
SKILL.md files, not affiliated with, endorsed by, or sponsored by Anthropic.