Skip to content

Laravel Svelte SaaS Starter Kit

Our Laravel SaaS backend with a Svelte 5 frontend written with runes and TypeScript. The UI is built from shadcn-svelte components on Bits UI, and shared .svelte.ts modules handle permissions, layout and translations.

Svelte frontend stack

Framework
Svelte 5 (runes) + TypeScript
Inertia adapter
@inertiajs/svelte v3
UI components
shadcn-svelte on Bits UI
Icons
lucide-svelte
Toasts
svelte-sonner
Menu drag & drop
sortablejs
Type check
svelte-check
TypeScript 5Tailwind CSS v4Vite 8WayfinderLang Sync InertiaESLint 9 + Prettier 3

Features

What's in the kit

Every backend feature comes with a finished Svelte UI: pages, dialogs, forms and toasts.

Authentication

Login, registration, password reset, email verification, two-factor auth, passkeys and profile & security settings. You switch each one on or off per domain.

Multi-tenancy

Each tenant gets its own database and subdomain. You create and edit tenants from a list with stats, track workspace status and invite each tenant's admin.

Domains

Give each tenant a primary domain and as many secondary ones as you need. Every domain has its own app name, default language and sign-in options.

Maintenance & suspension

Put every tenant workspace into maintenance with your own message, a secret bypass link and allowed IPs. You can also suspend a single workspace, which blocks it.

Users & invitations

Manage users with search and stats, give them a role and extra permissions, and invite them by email with a signed link.

Roles & permissions

Spatie roles and permissions with protected system roles, separate permission config files for the central and tenant apps, and menus that respect them.

Navigation & layouts

Menus live in the database and you reorder them by drag & drop. Pick a sidebar or header layout, a sidebar style, a sign-in layout and light or dark mode.

Localization

17 languages. Each user picks their own, each domain has a default, and validation messages are translated and shared with the frontend.

Testing & tooling

Pest feature tests, Larastan, Pint, ESLint and Prettier are set up, along with Laravel Boost guidelines and skills for AI coding agents.

Conventions

Idiomatic Svelte

The Svelte kit sticks to the usual Svelte conventions, and svelte-check checks the types.

Pages
resources/js/pages/tenants/Index.svelte
Components
PascalCase .svelte files
Shared logic
resources/js/lib/*.ts and *.svelte.ts

Translations in a component

import { svelteLang } from '@erag/lang-sync-inertia/svelte'

const { __ } = svelteLang()

__('modules.tenant.index.title')

Typed routes with Wayfinder

import { index } from '@/routes/tenants'

index.url()

Framework-specific implementation

Svelte 5 runes for focused page state

The Svelte kit uses runes for page state and shared .svelte.ts modules for behavior, while Laravel and Inertia continue to handle routing, validation and authorization.

  • Read Inertia page data with $props and derive filtered results with $derived.
  • Use $effect for debounced visits and put reusable permission or layout state in .svelte.ts modules.
  • Expose modal actions with bind:this and keep accessible controls in shadcn-svelte components.

A page in Svelte

<script lang="ts">
let { tenants }: { tenants: Tenant[] } = $props();
let query = $state('');
let filtered = $derived(
    tenants.filter((tenant) => tenant.name.includes(query)),
);
</script>

Shared backend

The same Laravel backend in every kit

The Vue, React and Svelte kits run exactly the same backend code. Only resources/js is different.

  • The full Laravel + Svelte source code
  • Access to the saas-laravel-starter-kit-svelte repository
  • Weekly updates, pushed to that repository
  • Pest feature tests, with Larastan and Pint already set up
  • 17 languages, with translations synced to the frontend
  • Documentation for the backend and the Svelte frontend
Framework
Laravel 13 on PHP 8.3+
Bridge
Inertia v3 (inertia-laravel)
Authentication
Laravel Fortify + passkeys
Multi-tenancy
stancl/tenancy, database per tenant
Authorization
spatie/laravel-permission
Validation & types
spatie/laravel-data + TypeScript transformer
Typed routes
Laravel Wayfinder
Translations
erag/laravel-lang-sync-inertia
Quality
Pest 5, Larastan, Pint, Laravel Boost

Start building with Svelte

The Svelte Starter Kit is $33, paid once, or get all three kits for $79. You keep access for life and get weekly updates.

One-time payment · Lifetime access · Weekly updates included · No recurring subscription