10+ UI Libraries for Svelte to Try in 2024

This page summarizes the projects mentioned and recommended in the original post on dev.to

InfluxDB - Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com
featured
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com
featured
  • svelte-material-ui

    Svelte Material UI Components

    Svelte Material UI is one of the oldest libraries for Svelte and it offers a decent collection of UI components with Google-inspired Material Design. This library also provides actions for a wide variety of interface elements and helper utilities for building custom and advanced UI components. The specialty of this library is that you need to install each component separately. Theming is done with Sass or with CSS variables.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • carbon-components-svelte

    Svelte implementation of the Carbon Design System

    Carbon Components is a Svelte component library that is built on top of the Carbon Design System, an open source design system by IBM. The components look very minimalistic (especially styling based on gray color saturation) but probably would fit in some business-looking app. In defense it must be said that the library offers a big number of Svelte components with advanced functionality.

  • attractions

    A pretty cool UI kit for Svelte

    Attractions is a UI kit for Svelte that includes 49 components and a collection of helper functions. It uses Sass for styling. Although the Attractions kit seems promising and the components look really nice, it's not very actively supported right now and its future is uncertain.

  • stwui

    Opinionated yet customizable Svelte-TailwindCSS component library

    STW UI is another component library built with Svelte and Tailwind CSS. It provides more than 40 Svelte components, and also actions and utilities aimed to speed up the web development process. With well-crafted documentation and examples, it's definitely worth looking at.

  • melt-ui

    A set of headless, accessible component builders for Svelte.

    Melt UI is the most powerful and complete headless library for Svelte. It offers a set of headless, accessible component builders, very customizable and flexible. Builders are just functions that generate a collection of properties that can be applied to any UI element.

  • skeleton

    A complete design system and component solution, built on Tailwind. (by skeletonlabs)

    GitHub: 4.6k stars License: MIT

  • carbon

    A design system built by IBM (by carbon-design-system)

    Carbon Components is a Svelte component library that is built on top of the Carbon Design System, an open source design system by IBM. The components look very minimalistic (especially styling based on gray color saturation) but probably would fit in some business-looking app. In defense it must be said that the library offers a big number of Svelte components with advanced functionality.

  • SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
  • flowbite-svelte

    Official Svelte components built for Flowbite and Tailwind CSS

    GitHub: 1.9k stars License: MIT

  • shadcn/ui

    Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.

    shadcn-svelte is an unofficial Svelte port of shadcn/ui. It's a collection of reusable components that you can copy and paste or use the CLI to add to your Svelte apps. There is no package, no dependencies. You just choose the components you need and customize them to your needs. You can use shadcn-svelte as a reference to build your own component libraries.

  • Svelte

    Cybernetically enhanced web apps

    Svelte is an open source JavaScript framework which gains popularity among web developers due to its fast client performance (compared to React and Vue), lightweight nature and ease of learning. Svelte, together with SvelteKit, makes web developers more productive allowing them to build projects faster, write code that is easier to understand and fix, and simply "code with joy".

  • svelteui

    SvelteUI Monorepo

    GitHub: 1.2k stars License: MIT

  • core

    SVAR Core library is a collection of essential UI components written with Svelte. (by svar-widgets)

    GitHub: 5 stars License: MIT for Core, paid with free trial for DataGrid, Gantt, File Manager.

  • bits-ui

    The headless components for Svelte.

    GitHub: 822 stars License: MIT

  • shadcn-svelte

    shadcn/ui, but for Svelte. ✨

    GitHub: 4k stars License: MIT

  • svelte-headlessui

    Unofficial Svelte port of the Headless UI component library

    GitHub: 1.8k stars License: MIT

  • Sass

    Sass makes CSS fun!

    Attractions is a UI kit for Svelte that includes 49 components and a collection of helper functions. It uses Sass for styling. Although the Attractions kit seems promising and the components look really nice, it's not very actively supported right now and its future is uncertain.

  • mantine

    A fully featured React components library

    SvelteUI includes 50+ customizable, accessible Svelte components. The components are built with TypeScript and support it by default. In addition to the components, the library includes out-of-the-box actions, transitions, and utilities. In general, it's a nice-looking library, heavily inspired by Mantine, with good documentation. The latest major update was released in August 2023.

  • flowbite

    Open-source UI component library and front-end development framework based on Tailwind CSS

    Flowbite Svelte is an open-source UI library built with Svelte components and Tailwind CSS. It provides over 58 UI components and interactive elements built with Svelte and Flowbite. It comes with well-organized documentation, where you can see the code sample and preview the components for responsive sizes: desktop, tablet and smartphone. You can also switch light/dark modes and RTL/LTR text direction. The code looks quite straightforward and the components are styled very neat.

  • SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts

  • Flowbite Svelte - Open-source Svelte UI component library [MIT License]

    1 project | /r/opensource | 30 Apr 2023
  • Flowbite Svelte - Open-source Svelte UI components built with Tailwind CSS [MIT License]

    1 project | /r/coolgithubprojects | 30 Apr 2023
  • Flowbite-Svelte website update

    1 project | /r/sveltejs | 20 Apr 2023
  • Help with tabs component

    3 projects | /r/sveltejs | 27 Feb 2023
  • What component libraries are available

    4 projects | /r/sveltejs | 15 Nov 2022