Track Awesome Svelte Updates Weekly
⚡ A curated list of awesome Svelte resources
🏠 Home · 🔍 Search · 🔥 Feed · 📮 Subscribe · ❤️ Sponsor · 😺 TheComputerM/awesome-svelte · ⭐ 1.3K · 🏷️ Front-End Development
Apr 22 - Apr 28, 2024
UI Libraries
- daisyUI - The most popular component library for Tailwind CSS -
daisyUIadds component class names to Tailwind CSS so you can make beautiful websites faster than ever.
Apr 15 - Apr 21, 2024
UI Libraries
- Svelte UX (⭐519) - Large collection of components, actions, stores, and utilities to build highly interactive applications
- AgnosUI - Highly configurable headless framework agnostic component library
Charts / Checkbox
- LayerChart (⭐299) - Large collection of composable Svelte components to build a wide range of visualizations, built upon Layer Cake
Mar 04 - Mar 10, 2024
Tutorials
- Setup Authentication with AuthJS and Sveltekit 2.0 - @bradcypert (YouTube)
State Libraries
- exome (⭐136) - Simple proxy based state manager for deeply nested states.
UI Libraries
- Skeleton - Skeleton uses Tailwind utility classes and design system to easily create theme-able user interfaces.
- M3 Svelte (⭐83) - Robust component library implementing Material Design 3
Frameworks / Checkbox
- svelte-document (⭐1) - Create documents (PDFs), resumes, or presentations entirely in Svelte.
Feb 05 - Feb 11, 2024
Miscellaneous / Checkbox
- css-3d-progress (⭐0) - A 3D Progress Bar component
Jan 29 - Feb 04, 2024
Form / Checkbox
- Formsnap - High level Svelte components for forms, built on top of Superforms and Zod.
Jan 15 - Jan 21, 2024
UI Libraries
- Melt UI (⭐2.9k) - A collection of accessible, reusable, and composable headless component builders and utilities.
- Radix Svelte (⭐470) - An unofficial community-led Svelte port of Radix UI Primitives
Dec 25 - Dec 31, 2023
WebGL / Checkbox
- threlte - Svelte wrapper for three.js
Dec 04 - Dec 10, 2023
Miscellaneous / Checkbox
- svelte-stepper (⭐124) - A Svelte component for building animated step flows.
Oct 23 - Oct 29, 2023
Form / Checkbox
- Superforms - SvelteKit library for handling server and client validation, and client-side display of forms.
PWA / Checkbox
- SvelteKit-Adapter-Versioned-Worker (⭐8) - An easy-to-use service worker build plugin where you don't need to worry about cache durations.
Sep 04 - Sep 10, 2023
UI Libraries
- STDF - Mobile web component library based on Svelte and Tailwind.
Jul 17 - Jul 23, 2023
Official Resources
Jul 10 - Jul 16, 2023
Notification
- svelte-sonner (⭐517) - An opinionated toast component for Svelte.
Internationalisation / Checkbox
- VoerkaI18n - Internationalization solution for
Javascript/Typescript/Vue/React/Solidjs/SvelteJs/ReactNative
Jun 12 - Jun 18, 2023
Routers / Checkbox
- Elegua (⭐67) - Small (< 180LoC), fast, easy, full featured SPA router
May 29 - Jun 04, 2023
Calendar
- date-picker-svelte (⭐284) - A date and time picker for Svelte with clean UX.
Apr 24 - Apr 30, 2023
UI Libraries
- Flowbite Svelte - Open-source Svelte UI components built with Tailwind CSS and Flowbite.
Mar 13 - Mar 19, 2023
Tutorials
Feb 27 - Mar 05, 2023
UI Libraries
- YeSvelte - YeSvelte is flexible Svelte UI component library built on top of Bootstrap css.
Jan 16 - Jan 22, 2023
Tutorials
- Typescript + Svelte Cheatsheet (⭐715) - An overview of all TypeScript related topics for Svelte and SvelteKit - @ivanhofer (Github).
State Libraries
- Svelte-Domain (⭐5) - The state management for svelte.
- svelte-asyncable (⭐167) - The Svelte store contract with support for asynchronous values.
Miscellaneous / Checkbox
- svelte-splitpanes (⭐329) - Full featured resizeable views panels
- mathjax-svelte (⭐0) - A Svelte component for MathJax.
Form / Checkbox
- svelte-form-builder (⭐56) - A No-code Drag n Drop Form Builder built for Svelte
Nov 14 - Nov 20, 2022
Charts / Checkbox
- Layer Cake (⭐1.2k) - A framework for mostly-reusable graphics with svelte
Oct 03 - Oct 09, 2022
Icons
- svelte-unicons (⭐2) - Unicons svg icons for Svelte based on @iconscout/unicons.
Sep 26 - Oct 02, 2022
Mobile
- Capacitor - Build native mobile apps with web technology and Svelte.
UI Libraries
- Svelte UI - SvelteUI is an all inclusive Svelte library.
Scaffold / Checkbox
- create-vite (⭐65k) - Generates scaffold for a vite + svelte app.
- create-svelte (⭐18k) - A CLI for creating a new SvelteKit project.
Routers / Checkbox
- @shaun/svelterouter (⭐3) - Another vue-router inspired Svelte router.
Sep 05 - Sep 11, 2022
Routers / Checkbox
- @danielsharkov/svelte-router (⭐13) - A simple & easy to use SPA router, developed with page transitions in mind.
Jul 25 - Jul 31, 2022
Preprocessing
- svelte-switch-case (⭐141) - Switch case syntax for Svelte.
Icons
- svelte-icomoon (⭐5) - It makes it very simple to use SVG icons in your Svelte projects.
Jul 18 - Jul 24, 2022
UI Libraries
- ionic-svelte (⭐711) - Svelte integration with Ionic's UI for mobile app development, including many starters.
Jun 20 - Jun 26, 2022
Notification
- svelte-french-toast (⭐747) - Buttery smooth toast notifications for Svelte, inspired by React Hot Toast. Lightweight, customizable, and beautiful by default.
May 30 - Jun 05, 2022
Animations / Checkbox
- AutoAnimate - A zero-config, drop-in animation utility that adds smooth transitions to your Svelte app.
May 16 - May 22, 2022
Form / Checkbox
- svelte-formly (⭐252) - A good solution to generate and control a dynamic forms using core and custom rules with customize styles.
Mar 07 - Mar 13, 2022
Charts / Checkbox
- svelte-frappe-charts (⭐301) - Svelte bindings for frappe-charts.
Feb 21 - Feb 27, 2022
UI Libraries
- AgnosticUI (⭐701) - Accessible Svelte Component Primitives (that also work with React, Vue 3, and Angular).
Feb 07 - Feb 13, 2022
Internationalisation / Checkbox
- svelte-fluent (⭐79) - Components for easy integration of Fluent localization.
- svelte-i18n (⭐1.2k) - Internationalization library for Svelte.
- sveltekit-i18n (⭐411) - For integrating i18n style localization in SvelteKit.
Jan 31 - Feb 06, 2022
Grid
- svelte-flex (⭐74) - A simple and reusable flexbox component for Svelte.
Miscellaneous / Checkbox
- svelte-copyright (⭐16) - A Svelte component to format and display a copyright notice.
Internationalisation / Checkbox
- @tolgee/svelte (⭐214) - Web-based localization tool enabling users to translate directly in the Svelte app they develop.
Jan 17 - Jan 23, 2022
Icons
- svelte-heroicons (⭐8) - Icons, crafted by the creators of Tailwind CSS.
Jan 03 - Jan 09, 2022
Form / Checkbox
- felte - Extensible form library, with built-in Yup, Zod, Vest, and Superstruct validation.
- vest (⭐2.5k) - 🦺 Declarative form validation framework inspired by unit testing.
Oct 25 - Oct 31, 2021
Tutorials
- Create your blog with SvelteKit - @zhuzilin (Github).
Notification
- @zerodevx/svelte-toast (⭐760) - Simple elegant toast notifications.
Oct 11 - Oct 17, 2021
Miscellaneous / Checkbox
- svelte-tree-viewer (⭐15) - A lightweight component to render tree views.
Aug 23 - Aug 29, 2021
Animations / Checkbox
- svelte-typewriter - A simple and reusable typewriter effect for your Svelte applications.
Aug 16 - Aug 22, 2021
Fonts / Checkbox
- svelte-web-fonts/google (⭐16) - Tiny component for easily loading Fonts via the Google Fonts API including autocompletion.
Jun 07 - Jun 13, 2021
UI Libraries
- Sveltestrap (⭐1.3k) - Bootstrap 4 & 5 components.
May 31 - Jun 06, 2021
Mobile
- Svelte Native - Svelte controlling native components via Nativescript.
- Framework7 - Full featured HTML framework for building iOS & Android apps.
Grid
- svelte-grid-responsive (⭐53) - Bootstrap-inspired responsive grid system.
Form / Checkbox
- svelte-forms-lib (⭐596) - A lightweight library for managing forms.
WebGL / Checkbox
- svelthree (⭐468) - Component library for declarative construction of reactive and reusable three.js scene graphs.
Portal / Checkbox
- svelte-portal (⭐409) - Component for rendering outside the DOM of parent component.
- svelte-teleport (⭐24) - A component to teleport elements across the DOM.
Routers / Checkbox
- svelte-router-spa (⭐506) - Router adds routing to your Single Page Applications (SPA). Includes localisation, guards and nested layouts.
- svelte-routing (⭐2k) - A declarative Svelte routing library with SSR support.
- tinro (⭐669) - A tiny, dependency free and highly declarative router.
- svelte-spa-router (⭐1.5k) - Optimized for Single Page Applications (SPA) with hash based routing and support for parameters.
- svelte-client-router (⭐15) - Svelte Client Router is everything you need and think when routing SPA's.
Frameworks / Checkbox
- SvelteKit - The fastest way to build Svelte apps.
- Elder.js - Opinionated static site generator and web framework for Svelte built with SEO in mind.
- Routify - Routes for Svelte, automated by your file structure.
- JungleJS - The Jamstack framework for Svelte with GraphQL.
Docs / Checkbox
- svelte-docster (⭐9) - Generate metadata about your Svelte files from jsdoc.
May 24 - May 30, 2021
Tutorials
- Meet Svelte 3, a Powerful, Even Radical JavaScript Framework - SitePoint, by Chrome DevTools engineer @Jack_Franklin.
May 10 - May 16, 2021
Tutorials
- Sapper Tutorial (Crash Course) - The Net Ninja (YouTube).
- Svelte 101 - @lihautan (YouTube).
- Learn Svelte by building a habit tracker app - RadDevon.
Table
- svelte-generic-crud-table (⭐61) - Agnostic web-component for object-arrays with CRUD functionality. Sort and resize columns. Multiple tables per page.
- svelte-generic-table-pager (⭐4) - Svelte-generic-crud-table with paginator.
Lint / Checkbox
- eslint-plugin-svelte (⭐253) - An ESLint plugin for Svelte using AST.
Apr 05 - Apr 11, 2021
UI Libraries
- svelte-chota (⭐289) - Component library built with Chota, a super light-weight CSS framework
Feb 15 - Feb 21, 2021
Tutorials
- Svelte Stores - @lihautan (YouTube).
- Svelte Actions - @lihautan (YouTube).
Feb 01 - Feb 07, 2021
Table
- svelte-simple-datatables (⭐267) - A Datatable component for Svelte
Jan 11 - Jan 17, 2021
YouTube Channels
Studies
- JavaScript Frameworks Performance Comparison - Performance of Svelte and other top javascript frameworks.
Preprocessing
- svelte-preprocess (⭐1.7k) - A preprocessor for PostCSS, SCSS, Less, Stylus, Coffeescript, TypeScript, Pug and much more.
Jan 04 - Jan 10, 2021
Community
- Japan Discord - Svelte 日本.
Tutorials
- Develop a complete application with Svelte and TypeScript - MDN Web Docs.
Dec 28 - Jan 03, 2020
Community
Tutorials
- SvelteJS Series - tutorials and talks - SpinSpire (YouTube).
Studies
- SvelteScaling - Does Svelte Scale?
- Will it Scale? (⭐170) - Finding Svelte's inflection point.
UI Libraries
- attractions (⭐995) - A pretty cool and modern UI kit
Scaffold / Checkbox
- component-template (⭐552) - A base for building shareable components.
- svelte-pwa-template (⭐219) - A starter template for PWAs based in the official Template.
Dec 21 - Dec 27, 2020
Preprocessing
- MDSveX (⭐2.2k) - Preprocessor for MDX markdown.
- svelte-preprocess-less (⭐13) - Preprocessor for less.
- modular-css (⭐286) - Preprocessor support for modular-css.
- svelte-preprocess-sass (⭐92) - Preprocessor for sass.
UI Libraries
- Smelte (⭐1.5k) - UI framework with material components built with Tailwind CSS.
- Svelte Material UI (⭐3.2k) - Material UI Components.
Table
- svelte-table (⭐494) - A table implementation that allows sorting and filtering.
Notification
- svelte-notifications (⭐308) - Toast notifications component that can be used in any JS application.
Icons
- svelte-fa (⭐389) - Tiny FontAwesome 5 component.
- svelte-simple-icons (⭐13) - Simple Icons component.
- svelte-awesome (⭐489) - Awesome SVG icon component, built with Font Awesome icons.
- svelte-icons (⭐288) - Icon components.
Calendar
- svelte-fullcalendar (⭐198) - A component wrapper around FullCalendar.
Maps
- svelte-googlemaps (⭐74) - Google Maps component.
- svelte-mapbox (⭐333) - MapBox map and autocomplete components.
- leaflet-svelte (⭐51) - Svelte wrapper for Leaflet.
Form / Checkbox
- svelte-checkbox (⭐77) - A checkbox component (cool animation, customizable).
- svelte-toggle (⭐22) - Basic toggle component with styling.
Lint / Checkbox
- prettier-plugin-svelte (⭐689) - Format your components using prettier.
- svelte-check - Check your code.
Docs / Checkbox
- sveltedoc-parser (⭐89) - Generate a JSON documentation for your component.
Test / Checkbox
- svelte-jester (⭐127) - A Jest transformer to compile your components before importing them into tests.
Editors / Visual Studio Code
- Svelte for VS Code - Provides syntax highlighting and rich intellisense for your components.
Editors / Atom
- ide-svelte - Provides syntax highlighting and rich intellisense for your components.
- language-svelte - Provides syntax highlighting for components, directives and other Svelte specific syntax in Atom.
Editors / Sublime Text
- Svelte - Syntax highlighting and support for Sublime Text.
Editors / Vim
- vim-svelte-plugin (⭐131) - Syntax highlighting and support for Vim.
- coc-svelte (⭐176) - Syntax highlighting and support for (Neo)Vim.
Editors / JetBrains
- Svelte - Syntax highlighting and support for JetBrains.
Nov 16 - Nov 22, 2020
Tutorials
- Getting Started with Svelte 3 - DigitalOcean.
- An Introduction to Actions - Svelte School.
- Svelte Tutorial for Beginners - The Net Ninja (YouTube).
Test / Checkbox
- @testing-library/svelte (⭐597) - Simple and complete Svelte DOM testing utilities that encourage good testing practices.
Oct 19 - Oct 25, 2020
Official Resources
Community
Conferences
Podcasts
YouTube Channels
Preprocessing
- svelte-preprocess-markdown (⭐134) - Write Svelte components in markdown syntax.
- svelte-preprocess-postcss (⭐25) - Use PostCSS to preprocess your styles in Svelte components.
UI Libraries
- carbon-components-svelte (⭐2.6k) - Svelte implementation of the IBM Carbon Design System.
Notification
- svelte-favicon-badge (⭐100) - A custom component that adds a favicon and a badge that you can use to show for example number of unread messages, etc.
Calendar
- svelte-calendar (⭐528) - A lightweight datepicker with neat animations and a unique UX.
Docs / Checkbox
- svelte-docs (⭐167) - A rapid way to write documentation for your Svelte components.
Test / Checkbox
- jest-transform-svelte (⭐35) - Jest Transformer for Svelte components.
Editors / Visual Studio Code
- Svelte 3 Snippets - Svelte 3 Snippets for VS Code.
Editors / Vim
- vim-svelte (⭐309) - Vim syntax highlighting and indentation for Svelte 3 components.