Skeleton

Skeleton is an adaptive design system built on Tailwind CSS. It includes themes, typography settings and turnkey components for several web frameworks.

Skeleton themes are driven by CSS custom properties, so you can register several themes and switch between them on demand. Typography and spacing settings sit in one place, which keeps text and layout consistent. The library provides common visual components such as cards, buttons and tables, built with semantic HTML and Tailwind utility classes. Framework-specific components handle state and user interaction, and the site lists which frameworks have those components. A Figma UI kit is available for designers who want to match the code.

• Themes built on CSS custom properties
• Switch between several themes on demand
• Typography and spacing settings in one place
• Turnkey components for several frameworks
• Figma UI kit for designers

Teams that already use Tailwind CSS and want a themed starting point. Developers who work across more than one frontend framework and want shared styles for each of them.

Skeleton is open source under the MIT license, so it is free to use. According to the site, the functional components are limited to some frameworks, including React and Svelte, so check the list before you choose one. The Figma kit and the themes are useful together when a team needs to keep design and code aligned.