PulseDev SvelteKit coming soon

Fix SvelteKit UI issues visually with AI

Click any element in your SvelteKit app. Describe the fix. PulseDev's AI analyzes your Svelte components, load functions, and styles — then writes production-ready code changes instantly.

Download Free for macOS View Setup Guide

Free tier available. No credit card required.

localhost:3000

acme

ProductPricingDocs

Ship pixel-perfect interfaces.

The fastest way to polish your front-end.

Get started

Watch demo

section.heroh1.hero-title

640 × 240320 × 44

Trusted by

10k+

99%

4.9

What is SvelteKit?

SvelteKit compiles away the framework. Not the UI bugs.

SvelteKit's compiler produces minimal JavaScript, but fixing layout issues, transition glitches, and scoped style conflicts across routes still requires manual DevTools work.

PulseDev vs. the old way

How SvelteKit developers fix UI issues — before and after PulseDev.

~30min

Legacy style fix

Inspecting compiled output, tracing scoped selectors, and debugging transitions across SvelteKit route changes.

~2min

With PulseDev

Click the element, describe the fix. PulseDev writes the Svelte component change and previews it via Vite HMR.

15x

Faster iteration

PulseDev maps compiled DOM back to your .svelte source — no more guessing which component owns what.

Install PulseDev

Download the PulseDev desktop app for macOS. Then add the plugin to your SvelteKit project.

Download PulseDev

Configure PulseDev for SvelteKit

Add the PulseDev script to your HTML to enable visual debugging. No npm package required.

HTML

<!-- Add to your HTML <head> -->
<script src="https://cdn.pulsedev.app/widget.js"
  data-project="YOUR_PROJECT_ID"
  defer></script>

Start the dev server

Run your SvelteKit dev server as usual. PulseDev will automatically connect.

terminal

$ npm run dev

  VITE v6.0.0 ready in 240ms
  ➜ Local: http://localhost:5173/
  → PulseDev: Visual debugging enabled
  → Status: Svelte inspector active

How to use

Point & Inspect

Click any element in your running app. PulseDev resolves the Svelte component source and reactive state instantly — no DevTools needed.

Pin & Describe

Drop numbered pins on elements and describe fixes in plain English. Attach screenshots or Figma frames for visual reference.

AI Chat & Preview

Claude proposes code diffs in a sidebar chat. See changes live via hot reload. Iterate with follow-up instructions — uses your Claude subscription at zero extra cost.

Ship with Confidence

Review staged diffs, approve or reject per change. Create commits, open PRs, or roll back with one click. Nothing ships without your approval.

SvelteKit-Specific Features

Runes Inspector

View $state, $derived, and $effect runes with their current values inline.

Load Function Debugging

Inspect +page.ts and +layout.ts load function data as it flows into components.

Form Actions

Debug SvelteKit form actions with request/response details and validation state.

Server Route Debugging

Inspect +server.ts endpoints with inline request/response data.

Questions, answered.

Does it work with Svelte 5?

Yes! PulseDev fully supports Svelte 5 runes and the new reactive system.

Can I debug load functions?

Absolutely. PulseDev traces data from load functions directly into your components.

Does it support scoped styles?

Yes, PulseDev understands Svelte's scoped CSS and generates fixes that follow your styling patterns.

Is there a performance overhead?

PulseDev only runs in development. It is completely stripped from your production builds.

Works with your stack

React Vue Astro Next.js WordPress Laravel Nuxt Solid Remix Eleventy Hugo Jekyll HTML