Introduction
A powerful UI toolkit built using Svelte and Tailwind CSS. Create adaptive, accessible design systems for your web apps.
Skeleton utilizes Tailwind’s utility classes and design system capabilities to quickly and easily create beautiful interfaces. Paired with Svelte’s powerful component architecture, Skeleton creates customized, responsive, and reactive interfaces for projects of any scope or scale.
Our Vision
Skeleton aims to provide a seamless user experience by creating intelligent and adaptive UI elements that automatically conform to the unique aesthetic of your application. It leverages native browser APIs and form elements, while also incorporating powerful components that follow WAI-ARIA guidelines for accessibility, empowering developers to create user-centric web applications with ease.
We're huge fans of Svelte and wish to contribute to this amazing ecosystem. We believe this only happens through contributions of high quality open source projects our own. Created by the community, for the community.
Finally, we aim for inclusion, whether you're a contributor to the project, a consumer, or the end user. The Skeleton core team is not a faceless corporate entity, but rather a small group of individuals motivated to make accessible UI with great UX (user experience) and DX (developer experience) for all.
Benefits
Free and Open Source
Skeleton is available as free and open-source software (FOSS) provided under the MIT License.
Community Owned
Skeleton is maintained by a number of talented contributors. If you wish to contribute to the project, you are welcome to do so. Visit the Skeleton communities on either GitHub or Discord.
Theme System
We provide a powerful and comprehensive theme system that goes well beyond generating a color palette. Themes allow you to control common settings, such as border radius, and apply those universally throughout your application. Furthermore, themes are built using CSS variables, which makes themes simple to configure and reuse.
Design Tokens
These tokens are a special set of CSS classes that ingest your theme settings for easy reuse throughout your design system. They are used as the default settings for most features within Skeleton, meaning your UI elements automatically adjust to theme changes. Likewise, these tokens are available to you, meaning you can build custom components using the same tools we do, for a truly cohesive look and feel.
Release Cycle
Skeleton receives new updates every other week, typically around Tuesday (US/Central). Each release is packed with new features, improvements, and bugfixes.
View ReleasesComparisons
A quick comparison to alternative open source UI libraries.
A library of UI elements designed by the creators of Tailwind CSS. This provides a huge library of turnkey HTML/CSS components. Currently Tailwind UI supports three options: HTML, React, and Vue. This means there's no plug and play solution for Svelte. You will need to generate your own components and build your own logic around these. Tailwind UI can be directly integrated with Skeleton though, providing tight integration with Skeleton's theme and design token systems.
View our Integration GuideFAQs
A list of common questions and issues from our community.
No, Skeleton does not require Typescript, though we highly recommend it. Please be aware all documentation examples are written with Typescript by default. If you wish to learn Typescript we recommend Total Typescript.