Get Started

Please be aware that Skeleton currently only supports Svelte applications built using SvelteKit. We recommend at least moderate experience with Svelte, SvelteKit, and Tailwind CSS before your proceed.

Install Skeleton

If you're creating a new project we highly recommend this option. The CLI will not only scaffold a new SvelteKit project for you, but automatically configure Skeleton, install Tailwind, and add optional dependencies on demand.

console 
npm create skeleton-app@latest my-skeleton-app
	- Enable SvelteKit's Typescript syntax (recommended)
cd my-skeleton-app

Tailwind CSS

Skeleton features tight integration with Tailwind CSS.

The CLI uses Svelte-Add to install and configure Tailwind within your project.

Stylesheets

The CLI will automatically import the Skeleton CSS stylesheet within src/routes/+layout.svelte.

Themes

Skeleton themes integrate with Tailwind and support color opacity, dark mode, and our powerful design tokens system.

The CLI will automatically import your preferred preset theme in src/routes/+layout.svelte. You may change this at any time.

typescript 
import '@skeletonlabs/skeleton/themes/theme-skeleton.css';

Learn how extend preset themes, customize backgrounds, and add custom fonts.

Themes →

Interested in creating your own custom theme? Try the Skeleton theme generator.

Generator →