For a UI component library for SvelteKit projects, the first results are skeletonlabs/skeleton, shoelace-style/shoelace (Shoelace is a framework-agnostic web component library with TypeScript, theming, accessibility, and dark mode, so it works as a UI component library in SvelteKit even though it lacks SvelteKit-specific integration) and huntabyte/shadcn-svelte. melt-ui/melt-ui and radix-ui/themes round out the shortlist. Compare the match explanations and check the project documentation against your requirements.
Collection of pre-built interface elements and design systems optimized for building SvelteKit web applications.
Skeleton is a design system and accessible UI component library built on Tailwind CSS. It provides a collection of pre-built interactive components with built-in accessibility and state management, alongside a CSS custom properties theme engine that enables runtime theme switching and dark mode support. The project distinguishes itself through its adaptive design system approach, using CSS custom properties to create themeable tokens that integrate directly with Tailwind's utility-first framework. This allows developers to build visual design systems with customizable colors, fonts, and aesth
Skeleton is a design system and accessible UI component library built for SvelteKit using Tailwind CSS, offering theming via CSS custom properties, TypeScript support, dark mode, and a collection of pre-built interactive components with built-in accessibility — exactly what you need to accelerate SvelteKit development.
Shoelace is a web component UI library consisting of a suite of accessible, framework-agnostic user interface elements. It provides a collection of custom element components and reusable HTML tags that encapsulate style and behavior to work across any JavaScript framework or plain HTML pages. The system is designed as a themable UI component system, utilizing CSS variables to manage visual themes and dark mode support. This allows for the implementation of custom design systems and a consistent visual language across web environments. The library covers broader capabilities in accessible int
Shoelace is a framework-agnostic web component library with TypeScript, theming, accessibility, and dark mode, so it works as a UI component library in SvelteKit even though it lacks SvelteKit-specific integration.
shadcn-svelte is a collection of accessible and customizable user interface elements for Svelte applications. Rather than being distributed as a traditional dependency, these components are provided as source code that is copied directly into the project codebase. The library utilizes a registry-based distribution system, allowing users to install specific UI blocks and components via a command-line interface. This system uses JSON metadata to define dependencies and file paths, while a bootstrapping process automates the configuration of styles and CSS variables. The project integrates Tail
shadcn-svelte is a collection of accessible, customizable UI components built specifically for Svelte and SvelteKit, distributed as source code with Tailwind CSS theming and TypeScript support — exactly the kind of reusable component library that accelerates SvelteKit development.
Melt UI is a headless UI library for Svelte that provides a collection of unstyled, accessible component builders. It functions as an accessible component framework and state management tool, offering the logic and state required to build interface elements that follow WAI-ARIA standards and support keyboard navigation without imposing specific visual styles. The library features a floating element positioning engine that manages the placement of popovers, tooltips, and menus relative to trigger elements. This system utilizes portals to prevent layout clipping and incorporates automatic overf
Melt UI provides headless, accessible component builders specifically for Svelte (and thus SvelteKit), giving you reusable building blocks to accelerate development, though its unstyled approach means theming and dark mode require your own styling.
This project is an accessible UI component library and themed design system. It provides a collection of pre-made user interface components designed to meet accessibility standards and maintain a consistent visual identity across web applications. The system includes an interactive theme previewer, which allows for the adjustment and testing of visual settings in real time within a running application. It covers global theme management and design system implementation through root configurations and a token-driven approach. The library supports rapid frontend prototyping by offering a set of
This is a React-based component library with theming and accessibility, not built for or compatible with SvelteKit, so it does not fit your need for SvelteKit-specific components.
Vant is a mobile UI library and component framework for Vue, providing a collection of lightweight, reusable interface elements optimized for small screens and touch interactions. It serves as a mobile component library and accessible web UI kit designed to integrate with Vue's reactivity and state management. The framework functions as a themable design system, allowing for visual branding and dark mode support through customizable theme variables. It includes built-in tools for internationalization to localize user interfaces across different geographic regions. The library covers a broad
Vant is a mobile UI component library built for Vue, not SvelteKit, so it does not provide the SvelteKit integration required for this search.
EUI is a React UI component library and design system framework. It provides a collection of reusable, typed interface components and visual guidelines to ensure a unified user experience across web application layouts. The project functions as a themed UI toolkit, enabling the management of visual aesthetics and the ability to toggle between light and dark modes. It incorporates a CSS-in-JS styling library for defining custom styles and rulesets for individual application elements. The framework covers broad capability areas including design system implementation, custom interface styling,
EUI is a design system and UI component library for React, not for SvelteKit, so it does not match the requirement for SvelteKit-specific components.
Ariakit is a headless component library and accessible UI component toolkit. It provides a set of unstyled web components with built-in accessibility patterns to ensure that screen readers and keyboard navigation function correctly. The project includes an adaptive color engine that calculates high-contrast text and dynamic surface colors for light and dark modes. It also features a concentric layout engine for computing nested padding, margins, and border radii for circular interface elements, alongside a design token system for managing global CSS variables. The toolkit covers broad capabi
Ariakit is a headless component library built for React, not SvelteKit, so it lacks the SvelteKit integration required for this search, though it does offer strong accessibility, theming, and dark mode support.
The United States Web Design System is a government design system and accessible UI framework. It provides a collection of standardized CSS and JavaScript components, along with a CSS component library, specifically designed for building consistent federal government websites. The system allows for custom CSS theme development through the use of design tokens for colors, spacing, and typography. Users can customize visual themes and compile custom styles to maintain a unified brand identity across multiple web properties. The framework covers responsive interface design and web accessibility
USWDS is a complete government design system with accessible UI components and theming, but it is a generic CSS/JS framework — not built for or compatible with SvelteKit, and lacks the TypeScript support and Svelte-specific integration you need.
gluestack-ui is a cross-platform React component library built with Tailwind CSS. It provides over 30 pre-built, accessible components that can be installed by copying their source files directly into a project, giving developers full control over customization without external runtime dependencies. Every component implements WAI-ARIA patterns, keyboard navigation, and screen reader support out of the box. A key differentiator is the copy-paste architecture: rather than a traditional package dependency, component source code is placed in the project, allowing direct editing and eliminating ve
gluestack-ui is a cross-platform component library built for React and React Native, not for SvelteKit, so it does not provide the SvelteKit integration required for this search.
Reka UI is a headless UI component library built for Vue and Nuxt, not for SvelteKit, so it does not meet the core requirement of SvelteKit integration.
Varlet is a Vue 3 material design component library and cross-platform UI framework. It provides a collection of reusable interface elements based on Material Design 2 and 3 standards for building responsive web applications. The library features integrated support for internationalization and multi-language content localization. It includes a theming system that utilizes CSS variables to enable dark mode, color scheme toggling, and custom branding. The toolkit is designed for server-side rendering to improve initial page load speeds and search engine optimization. It includes responsive com
Varlet is a Vue 3 material design component library, not built for or compatible with SvelteKit, so it does not match the search for SvelteKit-focused UI components.
| Repository | Stars | Language | License | Last push |
|---|---|---|---|---|
| skeletonlabs/skeleton | 6K | TypeScript | MIT | |
| shoelace-style/shoelace | 13.9K | TypeScript | MIT | |
| 8.3K |
| TypeScript |
| mit |
| melt-ui/melt-ui | 4.2K | TypeScript | MIT |
| radix-ui/themes | 8.5K | TypeScript | MIT |
| youzan/vant | 24.3K | TypeScript | MIT |
| elastic/eui | 6.3K | TypeScript | NOASSERTION |
| ariakit/ariakit | 8.6K | TypeScript | — |
| uswds/uswds | 7.1K | SCSS | NOASSERTION |
| gluestack/gluestack-ui | 4.9K | TypeScript | — |