262 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 262 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
Research shadcn-svelte and Bits UI source code and docs to inform decisions, debug issues, or
science
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
Rust の性能改善を「計測 → 仮説 → 変更 → 再計測」のループで地道に回すためのスキル。プロファイラの選び方、Cargo の最適化設定、データ構造・アロケーション・ハッシュ・分岐などの定石をフェーズ順に適用する。1 回 1 変更 1 計測の規律を厳守する。rsvelte 固有の既知ボトルネック（`serde_json::Value` 駆逐、`bump
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
Validate edited files, lint .svelte/.ts/.js, test stories, lint markdown. Auto-invoke after ANY file edit before declaring done. User-invocable as /frontend:validate-file [files].
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
Añade auth completo a un proyecto SvelteKit/Next: Keycloak self-hosted (default Vektrun no-vendor-lockin) o Supabase Auth (si el proyecto ya lo usa). Componentes: /login, /register
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
Ajoute ou expose une page publique dans anssi-portail et câble les couches nécessaires : page Jekyll, route Express et, selon le besoin, composant Svelte, entry point Vite client e
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
Cross-references C# Web API controllers/DTOs against their TypeScript/JavaScript consumers (React, Angular, Vue, Svelte, Node.js, or hand-written/auto-generated HTTP clients like F
engineering
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
Stavba nové komponenty nebo interaktivního bloku Atlasu myšlení (Svelte ostrov v Astru) a každá změna UI — podle design tokenů, s přístupností, testy v Playwrightu a snímky ve svět
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
Use when editing CSS, SCSS, or style blocks in .svelte files. Covers CSS-specific code style rules. Auto-invoke when writing or modifying styles.
engineering
Svelte component code style rules. Auto-invoke when creating .svelte files, editing component structure, transitions or layout reads, or SvelteKit URL state and navigation guards.
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
Use when composing a Svelte 5 feature from provider/wrapper components, content snippets, reactive state, or third-party DOM bridging (maplibre, leaflet, d3, tippy, popper). Covers
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
Collection and utilities for country flag SVGs, ISO 3166-1 alpha-2 codes, and country mappings. Use when needing country flags, nation icons, localized language selector flags, or
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
Generate production-ready, accessible, token-driven component code for ANY framework — React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, Web Components/Lit, React Nati
engineering
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
Svelte 5 adapter for the json-render devtools inspector. Use whenever the user wants to add, configure, or troubleshoot @json-render/devtools-svelte in a Svelte json-render app, in
engineering
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
Document a Svelte component using @component JSDoc. Auto-invoke when asked to document a .svelte component. Reads the component, analyzes its interface, and writes a structured @co
engineering
通过 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
Regras para construir front-end (telas, componentes, estilos, formulários, integração com a API) com acessibilidade, responsividade, bom desempenho e segurança, seguindo o design s
product
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
Use for web front ends — React 19, Next.js 16, Svelte 5, Vue, Astro, Tailwind v4, Web Vitals.
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
Audit interface source with HIG Doctor when the user asks to scan, lint, review, or remediate Swift, UIKit, AppKit, React, Vue, Svelte, Angular, Compose, Android XML, Flutter, CSS,
product
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
Find and use real Hugeicons icon names in any framework — React, Vue, Svelte, SolidJS, Angular, React Native and Flutter. Use whenever UI work needs icons — dashboards, sidebars, n
engineering
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
Generative UI framework that renders AI-generated JSON specs into type-safe UI components across React, Vue, Svelte, Solid, React Native, video, PDF, and email.
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
Migrates vibe-coded web applications to AWS. Handles the full workflow from analysis through migration to deployment, producing deployable AWS Blocks infrastructure code. Supports
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
Use when migrating .svelte files from Svelte 3/4 to Svelte 5 runes. Auto-invoke when converting $: reactive blocks, export let props, createEventDispatcher, or slot patterns. Cover
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
Use when writing or changing code that uses ogygia (SSR islands for SvelteKit) — islands, regions, wake/render import attributes, held regions, content collections, site(), markdow
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
Converts a screenshot, mockup, or Figma export into a production-ready UI component that reuses the project's existing design system (React/Next, Vue, Svelte, React Native, Flutter
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
Svelte CSF stories as Vitest browser tests via @storybook/addon-vitest: play, tags, decorators, asChild. Use when wiring or debugging them in Vitest/CI, or on 'Vitest failed to fin
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 component testing with @testing-library/svelte, vitest, component rendering, event simulation, store testing, and SvelteKit testing.
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
SKILL.md files, not affiliated with, endorsed by, or sponsored by Anthropic.