Awesome examples of SvelteKit in the wild. Visit janosh.github.io/awesome-sveltekit to view this list with screenshots plus search and sort functionality (e.g. based on GH stars).
Cybernetically enhanced web apps.
uses: CodeMirror, Mapbox, Docker
Self-hosted photo and video backup solution directly from your mobile phone.
uses: NestJS, TypeScript, Tailwind, Flutter, Python
Official SvelteKit docs [code]
The fastest way to build Svelte apps.
Gitpod streamlines developer workflows by providing prebuilt, collaborative development environments in your browser - powered by VS Code.
An open-source & self-hostable Heroku / Netlify alternative.
uses: PNPM, TypeScript, Tailwind, sveltekit-i18n, PostCSS, Husky
An OSS developer platform to build multi-step automations and internal apps from minimal Python and Typescript scripts.
uses: TypeScript, Tailwind, cssnano, Cypress, PostCSS, svelte-highlight, svelte-markdown
Powers the HuggingChat app. Making the community's best AI chat models available to everyone.
A fully featured web UI toolkit for Svelte + Tailwind. Supports SvelteKit, Vite, and Astro.
uses: Vitest, PostCSS, highlight.js, Tailwind, Typescript, jsdom
The Fireship PRO course platform frontend built with Svelte, Tailwind CSS, Hugo (for static content management), Firebase for Auth and DB, Flamethrower for routing.
uses: Tailwind, Hugo, Firebase, Flamethrower, Sass, PostCSS, Algolia
Svelte Material UI Components.
uses: MDsveX, TypeScript, highlight.js, remark, Sass
Edit, live preview and share mermaid charts and diagrams.
ChatGPT-Style Web UI Client for Ollama 🦙.
uses: highlight.js, MarkedJS, KaTeX, TypeScript, Tailwind
Evidence enables analysts to deliver a polished business intelligence system using SQL and markdown.
uses: PNPM, Changesets, echarts, uvu
shadcn/ui, but for Svelte.
uses: TypeScript, Vercel, Tailwind, PNPM, Changesets, vitest, Prism, MarkedJS
A lightweight Svelte component library for building interactive node-based flow diagrams.
uses: Playwright, D3, Testing Library, Tailwind, PostCSS, Vitest
Isolate vocals, drums, bass, and other instrumental stems from any song
SvelteKit implementation of the RealWorld app.
Replicate some of the macOS desktop experience on the web.
uses: TypeScript, Vercel, SCSS, PNPM, Iconify
Unofficial Svelte port of Headless UI components.
uses: MDsveX, TypeScript, PostCSS, Tailwind, cssnano, Jest, rehype
Official Svelte components built for Flowbite and Tailwind CSS. All interactivity handled by Svelte.
uses: PNPM, TypeScript, Tailwind, MDsveX, Prism, PostCSS, Playwright
Threlte is a component library for Svelte to build and render three.js scenes declaratively and state-driven in Svelte apps.
uses: TypeScript, Three.js, Tailwind, PostCSS, Algolia, Iconify
Headless, Authentication, Cart & Checkout, TailwindCSS, Server Rendered, Proxy + API Integrated, Animations, Stores, Lazy Loading, Loading Indicators, Carousel, Instant Search, Faceted Filters, Typescript, Open Source, MIT license. 1 command deploy to your own server, 1 click deploy to Netlify/Vercel.
uses: Vercel, Tailwind, TypeScript, svelte-toasts, PostCSS, cssnano
Bootstrap 4 & 5 components for Svelte.
uses: Storybook, Babel, Testing Library, Jest, PostCSS, Prism
Experimental Svelte charting library. Visualize data with a combination of HTML, SVG and canvas/WebGL. Designed with server-side rendering in mind, so graphs potentially work without JavaScript. Blog post.
uses: D3, surge.sh, TypeScript
A SvelteKit template for building CMS-free editable websites.
uses: Tailwind, ProseMirror, AWS
Three.js component library for Svelte. Abandoned. Check out threlte instead.
uses: TypeScript, PNPM, Vercel, MDsveX
Graphics framework for Svelte with colorful demo page. Can generate responsive graphics server-side that work without JavaScript.
uses: D3, GitHub Pages, JSDoc, Mocha, Underscore
Alternative frontend for YouTube Music.
uses: TypeScript, PostCSS, SCSS
Documentation site for Houdini.
uses: PNPM, MDsveX, Husky, highlight.js
Translate software products 2x faster.
uses: TypeScript, Vercel, IBM Carbon, Tailwind, Supabase
sveltekit-typescript-showcase [code]
This repository shows how Svelte and SvelteKit work together with TypeScript.
uses: TypeScript
Svelte port of Timo Lins' react-hot-toast, a lightweight, customizable toast notification library.
uses: TypeScript, Prism, Tailwind, PostCSS, PNPM
End-to-end type-safe APIs for your SvelteKit applications.
uses: TypeScript, tRPC
An opinionated blog starter for SvelteKit + Tailwind + Netlify. Refreshed for 2022!
A secure, open source notes and file sharing service inspired by PrivNote written in Rust & Svelte.
A library of Svelte actions.
uses: TypeScript, vitest, Tailwind, PostCSS, Prism
Useful svelte stuff to put in your projects.
uses: Changesets, MDsveX, PostCSS, PNPM, Turbo
A faithful implementation of Microsoft's Fluent design system in Svelte.
uses: MDsveX, SCSS, TypeScript, remark, rehype, PNPM, PostCSS, Prism
Sweet & Powerful SvelteKit Blog Template.
Good First Issue Finder [code]
Good First Issue Finder helps new contributors pave their path into the world of OSS.
uses: TypeScript, Tailwind, Husky, Octokit, PostCSS
✒︎ Simply Awesome Blog Starter built with SvelteKit and ❤
uses: UnoCSS, TypeScript, MarkedJS, PNPM, Vercel
3rd Party File Manager for Windows.
uses: PNPM, TypeScript, SCSS, Vercel
A soup-to-nuts interactive tutorial on how to build apps with Svelte.
uses: Vercel, PNPM, Prism, MarkedJS, CodeMirror
Uses OpenAI GPT-3 API and streaming Vercel edge functions to generate cinema recommendations based on user input.
uses: TypeScript, Vercel, Tailwind
🌸 Joy of Code is a digital garden growing curious minds.
uses: GitHub API, Monaco, Playwright, Google Analytics, Supabase, Vercel, PNPM, Sass, TypeScript, remark, rehype
Global network of Svelte fans striving to promote Svelte and its ecosystem.
uses: TypeScript, Gitpod
Modern Fluid Typography Editor [code]
Easily create and fine-tune fluid typography values with Modern CSS clamp()
.
uses: TypeScript, PostCSS, Chart.js, cssnano
SvelteKit static blog starter [code]
A pre-configured SvelteKit static blog starter, with Sass, Markdown, MDSvex, Rehype and background preloading.
Supercharged REPL for Svelte (think StackBlitz specialized for Svelte)
uses: Playwright, vitest, Iconify, MarkedJS, TypeScript, PNPM, Pocketbase, Vercel, Tailwind
Discover and share Neovim configurations and plugins.
uses: TypeScript, PNPM, tRPC-SvelteKit, Prisma, Tailwind, Octokit
Personal website and blog of Matt Fantinel, web developer.
Curated list of neovim plugins.
uses: TypeScript, Husky
I18n library for Svelte that analyzes your keys at build time for maximum performance and minimal footprint. Built as a SvelteKit plugin so good to use as a reference if you want to build one yourself.
Keyboard-friendly, accessible and highly customizable multi-select component.
uses: Vitest, Playwright, Typescript, PNPM, pre-commit, rehype, jsdom, GitHub Pages, mdsvexamples
SvelteKit, running on the edge. In this case, Vercel's edge network. See https://twitter.com/leeerob/status/1517627769924034565.
A multiplayer pixel art editor powered by Liveblocks.
uses: TypeScript, Liveblocks, Tailwind, PostCSS, panzoom
SvelteKit embed components for YouTube, Vimeo, Twitter, Spotify, SoundCloud, StackBlitz, CodePen, AnchorFM, Simple Cast and more.
uses: TypeScript, PNPM, Vercel, MDsveX, Tailwind, PostCSS, Husky, Playwright, DaisyUI
Browser game where the goal is to correctly line up pipes placed on hexagonal puzzle pieces.
uses: Vercel
Dead simple command palette with fuzzy search.
uses: TypeScript, Playwright, PostCSS, Tailwind, Release It, Vercel
Random collection of MIT-licensed standalone TikZ images, mostly about physics and machine learning.
uses: TypeScript, svelte-multiselect, pre-commit, PNPM, GitHub Pages
Product Design and Development agency website, built with Sveltekit.
uses: TypeScript, Vercel, Tailwind, AWS, Dynamodb, Notion, Storyblock, Matter.js, Plausible
A minimalist blog template built with SvelteKit and MDsveX.
uses: TypeScript, MDsveX, Rehype, Remark, PNPM, Vitest, Playwright
A tool for experimenting and trying out the ECMAScript Internationalization API.
uses: TypeScript, PNPM, Playwright, Vercel, svelte-highlight, Husky, commitlint
Interactive visualizations for materials science: periodic tables, 3d crystal structures (Molecules coming soon), Bohr atoms, nuclei, heatmaps, scatter plots.
uses: TypeScript, pre-commit, D3, svelte-multiselect, Vitest, Playwright, PNPM, jsdom, GitHub Pages
A simple web game where you are given 45 seconds and $100 to make as much money as you can trading a fake stock.
A modern webapp to write, run and learn M68K assembly code.
uses: TypeScript, Sass, Monaco, WASM
A set of example apps built with SvelteKit and deployed on Vercel. As an ongoing project, this will continue to be enhanced with more examples to showcase the power of SvelteKit.
uses: Tailwind, Vercel, GraphQL, Firebase, Typescript
The unofficial SvelteKit docs.
Blog posts with code snippets, contact form with Svelte Forms Lib, RSS and sitemap.
uses: Tailwind, MDsveX, Svelte Forms Lib
Creative, content-based portfolio site of Connor Rothschild.
Digital publication with emphasis on data viz.
Round-based browser game where you guess the year in which famous event happened. Answers range between 1900-2021. You start with 100 points. The more your guess is off, the more points you loose.
Multi-Monitor Calculator [code]
A tool for planning your multi-monitor setup.
uses: TypeScript, SMUI, Sass
Puru Vijay's blog site.
uses: Vercel, TypeScript, SCSS, Cloudinary
Easily generate a playlist for your upcoming concerts based on selected artists!
uses: TypeScript, Tailwind, Spotify Web API, Filepond, PNPM, Netlify
This blog starter shows how to use SvelteKit with GraphCMS.
Svelte Summit Fall 2021 [code]
The 4th virtual conference about Svelte
uses: Elder.js, PostCSS, Cloudflare
Scholarly conference in the digital humanities.
uses: MDsveX, MVP.css, Cloudflare
A tool to visualize historical agile scrum team performance based on behavior anchors.
uses: PicoCSS, Pocketbase, Vercel
Portfolio of Félix Péault, Digital Designer and Art Director. Sanity.io [interview], [feature].
Video tutorials for web developers and designers.
uses: TypeScript, Google Tag Manager
Free Javascript challenges. Learn Javascript online by solving coding exercises.
Data-centric UI experiments
uses: Three.js, Cytoscape.js, Vercel
A travel, photography and design project showcasing charismatic houses around the world.
uses: Typescript, SCSS, PostCSS, Motion One, OGL, WebGL, Directus, Swell Commerce, Vercel
Want to add an open-source project to this list? PRs welcome! This collection is a community effort intended as a learning resource for Svelte devs. Entry requirements:
These requirements arose over time so not all existing entries satisfy them. There can also be tradeoffs. For example, if novelty is very high, popularity can be lower. If you're unsure, please open a discussion first.
A good place to discover influential Svelte projects (not necessarily SvelteKit) is GitHub Trending. If anything on that list stands out to you but is missing here, please add it!