Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/janosh/awesome-sveltekit

Awesome examples of SvelteKit in the wild
https://github.com/janosh/awesome-sveltekit

List: awesome-sveltekit

awesome-list community svelte svelte-kit

Last synced: 1 day ago
JSON representation

Awesome examples of SvelteKit in the wild

Lists

README

        


Awesome SvelteKit

[![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)
[![Pull Requests Welcome](https://img.shields.io/badge/Pull%20Requests-welcome-brightgreen.svg?logo=github)](https://github.com/janosh/awesome-sveltekit/pulls)
[![Tests](https://github.com/janosh/awesome-sveltekit/actions/workflows/test.yml/badge.svg)](https://github.com/janosh/awesome-sveltekit/actions/workflows/test.yml)
[![GH Pages](https://github.com/janosh/awesome-sveltekit/actions/workflows/gh-pages.yml/badge.svg)](https://github.com/janosh/awesome-sveltekit/actions/workflows/gh-pages.yml)
[![pre-commit.ci status](https://results.pre-commit.ci/badge/github/janosh/awesome-sveltekit/main.svg)](https://results.pre-commit.ci/latest/github/janosh/awesome-sveltekit/main)


Awesome examples of SvelteKit in the wild. Visit **[janosh.github.io/awesome-sveltekit](https://janosh.github.io/awesome-sveltekit)** to view this list with screenshots plus search and sort functionality (e.g. based on GH stars).

## Sites

1. **[Svelte.dev](https://svelte.dev)** 
[[code](https://github.com/sveltejs/svelte/tree/master/sites/svelte.dev)] 

GitHub stars

Cybernetically enhanced web apps.

uses: [CodeMirror], [Mapbox], [Docker]

1. **[Immich](https://immich.app)** 
[[code](https://github.com/immich-app/immich)] 

GitHub stars

Self-hosted photo and video backup solution directly from your mobile phone.

uses: [NestJS], [TypeScript], [Tailwind], [Flutter], [Python]

1. **[Official SvelteKit docs](https://kit.svelte.dev)** 
[[code](https://github.com/sveltejs/kit/blob/-/sites/kit.svelte.dev)] 

GitHub stars

The fastest way to build Svelte apps.

uses: [Netlify], [PNPM]

1. **[Gitpod](https://gitpod.io)** 
[[code](https://github.com/gitpod-io/gitpod)] 

GitHub stars

Gitpod streamlines developer workflows by providing prebuilt, collaborative development environments in your browser - powered by VS Code.

uses: [MDsveX], [Tailwind], [Netlify]

1. **[Coolify](https://coolify.io)** 
[[code](https://github.com/coollabsio/coolify)] 

GitHub stars

An open-source & self-hostable Heroku / Netlify alternative.

uses: [PNPM], [TypeScript], [Tailwind], [sveltekit-i18n], [PostCSS], [Husky]

1. **[Windmill](https://windmill.dev)** 
[[code](https://github.com/windmill-labs/windmill/blob/-/frontend)] 

GitHub stars

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]

1. **[Chat UI](https://huggingface.co/chat)** 
[[code](https://github.com/huggingface/chat-ui)] 

GitHub stars

Powers the HuggingChat app. Making the community's best AI chat models available to everyone.

uses: [Huggingface Inference], [Huggingface Hub], [Tailwind]

1. **[Skeleton](https://skeleton.dev)** 
[[code](https://github.com/Brain-Bones/skeleton)] 

GitHub stars

A fully featured web UI toolkit for Svelte + Tailwind. Supports SvelteKit, Vite, and Astro.

uses: [Vitest], [PostCSS], [highlight.js], [Tailwind], [Typescript], [jsdom]

1. **[Fireship](https://fireship.io)** 
[[code](https://github.com/fireship-io/fireship.io)] 

GitHub stars

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]

1. **[Svelte Material UI](https://sveltematerialui.com)** 
[[code](https://github.com/hperrin/svelte-material-ui/blob/-/packages/site)] 

GitHub stars

Svelte Material UI Components.

uses: [MDsveX], [TypeScript], [highlight.js], [remark], [Sass]

1. **[mermaid-live-editor](https://mermaid.live)** 
[[code](https://github.com/mermaid-js/mermaid-live-editor)] 

GitHub stars

Edit, live preview and share mermaid charts and diagrams.

uses: [TypeScript], [Docker], [Tailwind], [PostCSS], [Cypress], [Husky]

1. **[Ollama Web UI](https://ollamahub.com)** 
[[code](https://github.com/ollama-webui/ollama-webui)] 

GitHub stars

ChatGPT-Style Web UI Client for Ollama 🦙.

uses: [highlight.js], [MarkedJS], [KaTeX], [TypeScript], [Tailwind]

1. **[evidence](https://evidence.dev)** 
[[code](https://github.com/evidence-dev/evidence/blob/-/sites/example-project)] 

GitHub stars

Evidence enables analysts to deliver a polished business intelligence system using SQL and markdown.

uses: [PNPM], [Changesets], [echarts], [uvu]

1. **[shadcn-svelte](https://shadcn-svelte.com)** 
[[code](https://github.com/huntabyte/shadcn-svelte/blob/-/apps/www)] 

GitHub stars

shadcn/ui, but for Svelte.

uses: [TypeScript], [Vercel], [Tailwind], [PNPM], [Changesets], [vitest], [Prism], [MarkedJS]

1. **[Svelvet](https://svelvet.io)** 
[[code](https://github.com/oslabs-beta/Svelvet)] 

GitHub stars

A lightweight Svelte component library for building interactive node-based flow diagrams.

uses: [Playwright], [D3], [Testing Library], [Tailwind], [PostCSS], [Vitest]

1. **[StemRoller](https://stemroller.com)** 
[[code](https://github.com/stemrollerapp/stemroller)] 

GitHub stars

Isolate vocals, drums, bass, and other instrumental stems from any song

uses: [Electron], [Tailwind], [Lodash], [PostCSS], [ytdl-core]

1. **[svelte-realworld](https://realworld.svelte.dev)** 
[[code](https://github.com/sveltejs/realworld)] 

GitHub stars

SvelteKit implementation of the RealWorld app.

uses: [Netlify], [MarkedJS]

1. **[macos-web](https://macos-web.app)** 
[[code](https://github.com/PuruVJ/macos-web)] 

GitHub stars

Replicate some of the macOS desktop experience on the web.

uses: [TypeScript], [Vercel], [SCSS], [PNPM], [Iconify]

1. **[Svelte Headless UI](https://svelte-headlessui.goss.io)** 
[[code](https://github.com/rgossiaux/svelte-headlessui)] 

GitHub stars

Unofficial Svelte port of Headless UI components.

uses: [MDsveX], [TypeScript], [PostCSS], [Tailwind], [cssnano], [Jest], [rehype]

1. **[Flowbite](https://flowbite-svelte.com)** 
[[code](https://github.com/themesberg/flowbite-svelte)] 

GitHub stars

Official Svelte components built for Flowbite and Tailwind CSS. All interactivity handled by Svelte.

uses: [PNPM], [TypeScript], [Tailwind], [MDsveX], [Prism], [PostCSS], [Playwright]

1. **[Threlte](https://threlte.xyz)** 
[[code](https://github.com/threlte/threlte/blob/-/apps/docs)] 

GitHub stars

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]

1. **[Svelte Commerce](https://demo.litekart.in)** 
[[code](https://github.com/itswadesh/svelte-commerce)] 

GitHub stars

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]

1. **[Sveltestrap](https://sveltestrap.js.org)** 
[[code](https://github.com/bestguy/sveltestrap)] 

GitHub stars

Bootstrap 4 & 5 components for Svelte.

uses: [Storybook], [Babel], [Testing Library], [Jest], [PostCSS], [Prism]

1. **[Pancake](https://pancake-charts.surge.sh)** 
[[code](https://github.com/Rich-Harris/pancake)] 

GitHub stars

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]

1. **[editable-website](https://editable.website)** 
[[code](https://github.com/michael/editable-website)] 

GitHub stars

A SvelteKit template for building CMS-free editable websites.

uses: [Tailwind], [ProseMirror], [AWS]

1. **[Svelte Cubed](https://svelte-cubed.vercel.app)** 
[[code](https://github.com/Rich-Harris/svelte-cubed)] 

GitHub stars

Three.js component library for Svelte. Abandoned. Check out threlte instead.

uses: [TypeScript], [PNPM], [Vercel], [MDsveX]

1. **[Layer Cake](https://layercake.graphics)** 
[[code](https://github.com/mhkeller/layercake)] 

GitHub stars

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]

1. **[Beatbump](https://beatbump.io)** 
[[code](https://github.com/snuffyDev/beatbump)] 

GitHub stars

Alternative frontend for YouTube Music.

uses: [TypeScript], [PostCSS], [SCSS]

1. **[Houdini GraphQL](https://houdinigraphql.com)** 
[[code](https://github.com/HoudiniGraphQL/houdini)] 

GitHub stars

Documentation site for Houdini.

uses: [PNPM], [MDsveX], [Husky], [highlight.js]

1. **[inlang](https://inlang.com)** 
[[code](https://github.com/inlang/monorepo)] 

GitHub stars

Translate software products 2x faster.

uses: [TypeScript], [Vercel], [IBM Carbon], [Tailwind], [Supabase]

1. **[sveltekit-typescript-showcase](https://github.com/ivanhofer/sveltekit-typescript-showcase)** 
[[code](https://github.com/ivanhofer/sveltekit-typescript-showcase)] 

GitHub stars

This repository shows how Svelte and SvelteKit work together with TypeScript.

uses: [TypeScript]

1. **[svelte-french-toast](https://svelte-french-toast.com)** 
[[code](https://github.com/kbrgl/svelte-french-toast)] 

GitHub stars

Svelte port of Timo Lins' react-hot-toast, a lightweight, customizable toast notification library.

uses: [TypeScript], [Prism], [Tailwind], [PostCSS], [PNPM]

1. **[tRPC-SvelteKit](https://icflorescu.github.io/trpc-sveltekit)** 
[[code](https://github.com/icflorescu/trpc-sveltekit)] 

GitHub stars

End-to-end type-safe APIs for your SvelteKit applications.

uses: [TypeScript], [tRPC]

1. **[swyxkit](https://swyxkit.netlify.app)** 
[[code](https://github.com/sw-yx/swyxkit)] 

GitHub stars

An opinionated blog starter for SvelteKit + Tailwind + Netlify. Refreshed for 2022!

uses: [Tailwind], [Netlify]

1. **[Cryptgeon](https://cryptgeon.nicco.io)** 
[[code](https://github.com/cupcakearmy/cryptgeon/blob/-/packages/frontend)] 

GitHub stars

A secure, open source notes and file sharing service inspired by PrivNote written in Rust & Svelte.

uses: [svelte-intl-precompile], [sanitize-html]

1. **[svelte-legos](https://svelte-legos.singhalankur.com)** 
[[code](https://github.com/ankurrsinghal/svelte-legos)] 

GitHub stars

A library of Svelte actions.

uses: [TypeScript], [vitest], [Tailwind], [PostCSS], [Prism]

1. **[svelte-put](https://svelte-put.vnphanquang.com)** 
[[code](https://github.com/vnphanquang/svelte-put)] 

GitHub stars

Useful svelte stuff to put in your projects.

uses: [Changesets], [MDsveX], [PostCSS], [PNPM], [Turbo]

1. **[Fluent Svelte](https://fluent-svelte.vercel.app)** 
[[code](https://github.com/Tropix126/fluent-svelte)] 

GitHub stars

A faithful implementation of Microsoft's Fluent design system in Svelte.

uses: [MDsveX], [SCSS], [TypeScript], [remark], [rehype], [PNPM], [PostCSS], [Prism]

1. **[Urara](https://urara-demo.netlify.app)** 
[[code](https://github.com/importantimport/urara)] 

GitHub stars

Sweet & Powerful SvelteKit Blog Template.

uses: [MDsveX], [PostCSS], [Tailwind], [DaisyUI], [TypeScript], [PNPM]

1. **[Good First Issue Finder](https://finder.eddiehub.io)** 
[[code](https://github.com/EddieHubCommunity/good-first-issue-finder)] 

GitHub stars

Good First Issue Finder helps new contributors pave their path into the world of OSS.

uses: [TypeScript], [Tailwind], [Husky], [Octokit], [PostCSS]

1. **[QWER](https://svelte-qwer.vercel.app)** 
[[code](https://github.com/kwchang0831/svelte-QWER)] 

GitHub stars

✒︎ Simply Awesome Blog Starter built with SvelteKit and ❤

uses: [UnoCSS], [TypeScript], [MarkedJS], [PNPM], [Vercel]

1. **[Files](https://files.community)** 
[[code](https://github.com/files-community/website)] 

GitHub stars

3rd Party File Manager for Windows.

uses: [PNPM], [TypeScript], [SCSS], [Vercel]

1. **[learn.svelte.dev](https://learn.svelte.dev)** 
[[code](https://github.com/sveltejs/learn.svelte.dev)] 

GitHub stars

A soup-to-nuts interactive tutorial on how to build apps with Svelte.

uses: [Vercel], [PNPM], [Prism], [MarkedJS], [CodeMirror]

1. **[Watch This](https://what-to-watch-roan.vercel.app)** 
[[code](https://github.com/StephDietz/watch-this)] 

GitHub stars

Uses OpenAI GPT-3 API and streaming Vercel edge functions to generate cinema recommendations based on user input.

uses: [TypeScript], [Vercel], [Tailwind]

1. **[Joy of Code](https://joyofcode.xyz)** 
[[code](https://github.com/mattcroat/joy-of-code)] 

GitHub stars

🌸 Joy of Code is a digital garden growing curious minds.

uses: [GitHub API], [Monaco], [Playwright], [Google Analytics], [Supabase], [Vercel], [PNPM], [Sass], [TypeScript], [remark], [rehype]

1. **[Svelte Society](https://sveltesociety.dev)** 
[[code](https://github.com/svelte-society/sveltesociety.dev)] 

GitHub stars

Global network of Svelte fans striving to promote Svelte and its ecosystem.

uses: [TypeScript], [Gitpod]

1. **[Modern Fluid Typography Editor](https://modern-fluid-typography.vercel.app)** 
[[code](https://github.com/codeAdrian/modern-fluid-typography-editor)] 

GitHub stars

Easily create and fine-tune fluid typography values with Modern CSS clamp().

uses: [TypeScript], [PostCSS], [Chart.js], [cssnano]

1. **[SvelteKit static blog starter](https://sveltekit-static-starter.netlify.app)** 
[[code](https://github.com/josh-collinsworth/sveltekit-blog-starter)] 

GitHub stars

A pre-configured SvelteKit static blog starter, with Sass, Markdown, MDSvex, Rehype and background preloading.

uses: [Netlify], [MDsveX], [Sass], [Husky]

1. **[SvelteLab](https://sveltelab.dev)** 
[[code](https://github.com/sveltelab/sveltelab)] 

GitHub stars

Supercharged REPL for Svelte (think StackBlitz specialized for Svelte)

uses: [Playwright], [vitest], [Iconify], [MarkedJS], [TypeScript], [PNPM], [Pocketbase], [Vercel], [Tailwind]

1. **[Dotfyle](https://dotfyle.com)** 
[[code](https://github.com/codicocodes/dotfyle)] 

GitHub stars

Discover and share Neovim configurations and plugins.

uses: [TypeScript], [PNPM], [tRPC-SvelteKit], [Prisma], [Tailwind], [Octokit]

1. **[Matt Fantinel](https://fantinel.dev)** 
[[code](https://github.com/matfantinel/matfantinel.github.io)] 

GitHub stars

Personal website and blog of Matt Fantinel, web developer.

uses: [MDsveX], [SCSS], [Iconoir], [Plausible]

1. **[neovim craft](https://neovimcraft.com)** 
[[code](https://github.com/neurosnap/neovimcraft)] 

GitHub stars

Curated list of neovim plugins.

uses: [TypeScript], [Husky]

1. **[Svelte Intl Precompile](https://svelte-intl-precompile.com/en/docs/configuration)** 
[[code](https://github.com/cibernox/svelte-intl-precompile)] 

GitHub stars

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.

uses: [JS-Yaml], [JSON5]

1. **[Svelte MultiSelect](https://janosh.github.io/svelte-multiselect)** 
[[code](https://github.com/janosh/svelte-multiselect)] 

GitHub stars

Keyboard-friendly, accessible and highly customizable multi-select component.

uses: [Vitest], [Playwright], [Typescript], [PNPM], [pre-commit], [rehype], [jsdom], [GitHub Pages], [mdsvexamples]

1. **[SvelteKit on Edge](https://sveltekit-on-the-edge.vercel.app)** 
[[code](https://github.com/Rich-Harris/sveltekit-on-the-edge)] 

GitHub stars

SvelteKit, running on the edge. In this case, Vercel's edge network. See https://twitter.com/leeerob/status/1517627769924034565.

uses: [PNPM], [Vercel]

1. **[Pixel Art Together](https://pixelart.liveblocks.app)** 
[[code](https://github.com/liveblocks/pixel-art-together)] 

GitHub stars

A multiplayer pixel art editor powered by Liveblocks.

uses: [TypeScript], [Liveblocks], [Tailwind], [PostCSS], [panzoom]

1. **[SvelteKit Embed](https://sveltekit-embed.vercel.app)** 
[[code](https://github.com/spences10/sveltekit-embed)] 

GitHub stars

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]

1. **[Hexapipes](https://hexapipes.vercel.app)** 
[[code](https://github.com/gereleth/hexapipes)] 

GitHub stars

Browser game where the goal is to correctly line up pipes placed on hexagonal puzzle pieces.

uses: [Vercel]

1. **[svelte-command-palette](https://svelte-command-palette.vercel.app)** 
[[code](https://github.com/rohitpotato/svelte-command-palette)] 

GitHub stars

Dead simple command palette with fuzzy search.

uses: [TypeScript], [Playwright], [PostCSS], [Tailwind], [Release It], [Vercel]

1. **[TikZ](https://janosh.github.io/tikz)** 
[[code](https://github.com/janosh/tikz)] 

GitHub stars

Random collection of MIT-licensed standalone TikZ images, mostly about physics and machine learning.

uses: [TypeScript], [svelte-multiselect], [pre-commit], [PNPM], [GitHub Pages]

1. **[Significa.co](https://significa.co)** 
[[code](https://github.com/significa/significa.co)] 

GitHub stars

Product Design and Development agency website, built with Sveltekit.

uses: [TypeScript], [Vercel], [Tailwind], [AWS], [Dynamodb], [Notion], [Storyblock], [Matter.js], [Plausible]

1. **[sveltekit-mdsvex-blog](https://sveltekit-mdsvex-blog.netlify.app)** 
[[code](https://github.com/mvasigh/sveltekit-mdsvex-blog)] 

GitHub stars

A minimalist blog template built with SvelteKit and MDsveX.

uses: [TypeScript], [MDsveX], [Rehype], [Remark], [PNPM], [Vitest], [Playwright]

1. **[Intl Explorer](https://intl-explorer.com)** 
[[code](https://github.com/jesperorb/intl-explorer)] 

GitHub stars

A tool for experimenting and trying out the ECMAScript Internationalization API.

uses: [TypeScript], [PNPM], [Playwright], [Vercel], [svelte-highlight], [Husky], [commitlint]

1. **[Elementari](https://janosh.github.io/elementari)** 
[[code](https://github.com/janosh/elementari)] 

GitHub stars

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]

1. **[Paper Trader Game](https://paper-trader.davjhan.com)** 
[[code](https://github.com/davjhan/paper-trader-game)] 

GitHub stars

A simple web game where you are given 45 seconds and $100 to make as much money as you can trading a fake stock.

uses: [Tailwind], [Netlify], [Chart.js], [Plausible]

1. **[ASM Editor](https://asm-editor.specy.app)** 
[[code](https://github.com/Specy/asm-editor)] 

GitHub stars

A modern webapp to write, run and learn M68K assembly code.

uses: [TypeScript], [Sass], [Monaco], [WASM]

1. **[SvelteKit Experiments](https://sveltekit-demo-psi.vercel.app)** 
[[code](https://github.com/tsukhu/sveltekit-demo)] 

GitHub stars

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]

1. **[SK Incognito](https://sk-incognito.vercel.app)** 
[[code](https://github.com/GrygrFlzr/kit-docs)] 

GitHub stars

The unofficial SvelteKit docs.

uses: [MDsveX], [Tailwind], [PNPM]

1. **[markushatvan.com](https://markushatvan.com)**

Blog posts with code snippets, contact form with Svelte Forms Lib, RSS and sitemap.

uses: [Tailwind], [MDsveX], [Svelte Forms Lib]

1. **[connorrothschild.com](https://connorrothschild.com)** 
[[code](https://github.com/connorrothschild/.com)] 

GitHub stars

Creative, content-based portfolio site of Connor Rothschild.

uses: [MDsveX], [GSAP], [Netlify]

1. **[Svead](https://svead.pages.dev)** 
[[code](https://github.com/spences10/svead)] 

GitHub stars

Svead 🍺, a component that allows you to set head meta information, canonical, title, Twitter and Facebook Open Graph tags, and schema.org data.

uses: [TypeScript], [PNPM], [Cloudflare Pages], [MDsveX], [Tailwind], [PostCSS], [DaisyUI]

1. **[The Pudding](https://pudding.cool)** 
[[code](https://github.com/the-pudding/website)] 

GitHub stars

Digital publication with emphasis on data viz.

uses: [D3], [PostCSS], [Lodash], [PNPM]

1. **[Passkey authentication starter](https://d1rl0ue18b0151.cloudfront.net)** 
[[code](https://github.com/passlock-dev/svelte-passkeys)] 

GitHub stars

SvelteKit template featuring Passkeys, Social Sign in and more.

uses: [passlock], [tailwind], [superforms], [lucia]

1. **[Guess The Year](https://guess-the-year.davjhan.com)** 
[[code](https://github.com/davjhan/guess-the-year-game)] 

GitHub stars

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.

uses: [Tailwind], [Netlify]

1. **[Multi-Monitor Calculator](https://multimonitorcalculator.com)** 
[[code](https://github.com/KevinVandy/multi-monitor_calculator)] 

GitHub stars

A tool for planning your multi-monitor setup.

uses: [TypeScript], [SMUI], [Sass]

1. **[puruvj.dev](https://puruvj.dev)** 
[[code](https://github.com/puruvj/puruvjdev3)] 

GitHub stars

Puru Vijay's blog site.

uses: [Vercel], [TypeScript], [SCSS], [Cloudinary]

1. **[ConcertMash](https://concertmash.com)** 
[[code](https://github.com/mcmxcdev/ConcertMash)] 

GitHub stars

Easily generate a playlist for your upcoming concerts based on selected artists!

uses: [TypeScript], [Tailwind], [Spotify Web API], [Filepond], [PNPM], [Netlify]

1. **[GraphCMS Starter Blog](https://scottspence.com/2021/05/06/graphcms-svelte-starter)** 
[[code](https://github.com/spences10/sveltekit-starter-blog)] 

GitHub stars

This blog starter shows how to use SvelteKit with GraphCMS.

uses: [Vercel], [Tailwind], [SCSS], [GraphCMS]

1. **[Svelte Summit Fall 2021](https://sveltesummit.com)** 
[[code](https://github.com/svelte-society/svelte-summit)] 

GitHub stars

The 4th virtual conference about Svelte

uses: [Elder.js], [PostCSS], [Cloudflare]

1. **[digital criticism](https://critique-digitale.ch)** 
[[code](https://github.com/critique-digitale/critique-digitale.ch)] 

GitHub stars

Scholarly conference in the digital humanities.

uses: [MDsveX], [MVP.css], [Cloudflare]

1. **[Team Health Check](https://team-health-check-coral.vercel.app)** 
[[code](https://github.com/codehub-kirans/team-health-check)] 

GitHub stars

A tool to visualize historical agile scrum team performance based on behavior anchors.

uses: [PicoCSS], [Pocketbase], [Vercel]

1. **[Flayks](https://flayks.com)**

Portfolio of Félix Péault, Digital Designer and Art Director. Sanity.io [interview], [feature].

uses: [Sanity], [anime.js], [Vercel], [TypeScript], [SCSS], [PostCSS]

1. **[Level Up Tutorials](https://leveluptutorials.com)**

Video tutorials for web developers and designers.

uses: [TypeScript], [Google Tag Manager]

1. **[JSchallenger](https://jschallenger.com)**

Free Javascript challenges. Learn Javascript online by solving coding exercises.

uses: [Tailwind], [DynamoDB], [AWS]

1. **[cybernetic.dev](https://cybernetic.dev)**

Data-centric UI experiments

uses: [Three.js], [Cytoscape.js], [Vercel]

1. **[Houses of World](https://housesof.world)**

A travel, photography and design project showcasing charismatic houses around the world.

uses: [Typescript], [SCSS], [PostCSS], [Motion One], [OGL], [WebGL], [Directus], [Swell Commerce], [Vercel]

[algolia]: https://algolia.com
[anime.js]: https://animejs.com
[aws]: https://aws.amazon.com
[babel]: https://babeljs.io
[changesets]: https://github.com/changesets/changesets
[chart.js]: https://chartjs.org
[cloudflare pages]: https://pages.cloudflare.com
[cloudflare]: https://cloudflare.com
[cloudinary]: https://cloudinary.com
[codemirror]: https://codemirror.net
[commitlint]: https://github.com/conventional-changelog/commitlint
[cssnano]: https://cssnano.co
[cypress]: https://cypress.io
[cytoscape.js]: https://js.cytoscape.org
[d3]: https://d3js.org
[daisyui]: https://daisyui.com
[directus]: https://directus.io
[docker]: https://docker.com
[dynamodb]: https://aws.amazon.com/dynamodb
[echarts]: https://github.com/apache/echarts
[elder.js]: https://github.com/Elderjs/elderjs
[electron]: https://electronjs.org
[filepond]: https://pqina.nl/filepond
[firebase]: https://firebase.google.com
[flamethrower]: https://github.com/fireship-io/flamethrower
[flutter]: https://flutter.dev
[github api]: https://docs.github.com/rest
[github pages]: https://pages.github.com
[gitpod]: https://gitpod.io
[google analytics]: https://analytics.google.com
[google tag manager]: https://tagmanager.google.com
[graphcms]: https://graphcms.com
[graphql]: https://graphql.org
[gsap]: https://greensock.com/gsap
[highlight.js]: https://highlightjs.org
[huggingface hub]: https://github.com/huggingface/huggingface_hub
[huggingface inference]: https://github.com/huggingface/text-generation-inference
[hugo]: https://gohugo.io
[husky]: https://github.com/typicode/husky
[ibm carbon]: https://carbondesignsystem.com
[iconify]: https://iconify.design
[iconoir]: https://iconoir.com
[jest]: https://jestjs.io
[js-yaml]: https://github.com/nodeca/js-yaml
[jsdoc]: https://jsdoc.app
[jsdom]: https://github.com/jsdom/jsdom
[json5]: https://github.com/json5/json5
[katex]: https://github.com/KaTeX/KaTeX
[liveblocks]: https://liveblocks.io
[lodash]: https://lodash.com
[lucia]: https://github.com/lucia-auth/lucia
[mapbox]: https://mapbox.com
[markedjs]: https://marked.js.org
[matter.js]: https://brm.io/matter-js
[mdsvex]: https://github.com/pngwn/MDsveX
[mdsvexamples]: https://github.com/mattjennings/mdsvexamples
[mocha]: https://mochajs.org
[monaco]: https://microsoft.github.io/monaco-editor
[motion one]: https://motion.dev
[mvp.css]: https://github.com/andybrewer/mvp
[nestjs]: https://nestjs.com
[netlify]: https://netlify.com
[notion]: https://notion.so
[octokit]: https://github.com/octokit/octokit.js
[ogl]: https://github.com/oframe/ogl
[panzoom]: https://github.com/timmywil/panzoom
[passlock]: https://github.com/passlock-dev/passkeys
[picocss]: https://picocss.com
[plausible]: https://plausible.io
[playwright]: https://playwright.dev
[pnpm]: https://pnpm.io
[pocketbase]: https://pocketbase.io
[postcss]: https://postcss.org
[pre-commit]: https://pre-commit.com
[prism]: https://prismjs.com
[prisma]: https://prisma.io
[prosemirror]: https://prosemirror.net
[python]: https://python.org
[rehype]: https://github.com/rehypejs/rehype
[release it]: https://github.com/release-it/release-it
[remark]: https://github.com/remarkjs/remark
[sanitize-html]: https://github.com/apostrophecms/sanitize-html
[sanity]: https://sanity.io
[sass]: https://sass-lang.com
[scss]: https://sass-lang.com/documentation/syntax
[smui]: https://sveltematerialui.com
[spotify web api]: https://github.com/JMPerez/spotify-web-api-js
[storyblock]: https://storyblok.com
[storybook]: https://storybook.js.org
[supabase]: https://supabase.com
[superforms]: https://github.com/ciscoheat/sveltekit-superforms
[surge.sh]: https://surge.sh
[svelte forms lib]: https://github.com/tjinauyeung/svelte-forms-lib
[svelte-highlight]: https://github.com/metonym/svelte-highlight
[svelte-intl-precompile]: https://github.com/cibernox/svelte-intl-precompile
[svelte-markdown]: https://github.com/pablo-abc/svelte-markdown
[svelte-multiselect]: https://github.com/janosh/svelte-multiselect
[svelte-toasts]: https://github.com/mzohaibqc/svelte-toasts
[sveltekit-i18n]: https://github.com/sveltekit-i18n/lib
[swell commerce]: https://swell.is
[tailwind]: https://tailwindcss.com
[testing library]: https://testing-library.com
[three.js]: https://threejs.org
[trpc-sveltekit]: https://github.com/icflorescu/trpc-sveltekit
[trpc]: https://trpc.io
[turbo]: https://github.com/vercel/turbo
[typescript]: https://typescriptlang.org
[underscore]: https://underscorejs.org
[unocss]: https://github.com/unocss/unocss
[uvu]: https://github.com/lukeed/uvu
[vercel]: https://vercel.com
[vitest]: https://vitest.dev
[wasm]: https://webassembly.org
[webgl]: https://developer.mozilla.org/docs/Web/API/WebGL_API
[ytdl-core]: https://github.com/fent/node-ytdl-core

## 🎉 Suggestions Welcome

Want to add an open-source project to this list? [PRs welcome](https://github.com/janosh/awesome-sveltekit/edit/main/sites.yml)! This collection is a community effort intended as a learning resource for Svelte devs. Entry requirements:

1. **open source**: While a site with private code can give design and feature ideas, there's little educational value if you can't inspect how it was made.
1. **novel**: Not just another blog or todo app. Ideally, some application or technology not already covered in this collection.
1. **popular**: At least 50 stars on GitHub or reasonable expectation to reach that number soon.

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](https://github.com/janosh/awesome-sveltekit/discussions) first.

A good place to discover influential Svelte projects (not necessarily SvelteKit) is [GitHub Trending](https://github.com/trending/svelte?since=monthly). If anything on that list stands out to you but is missing here, please add it!