Installation

Start a new project

The fastest way to begin is the scaffolder. It creates a ready-to-run SvelteKit project already wired with DocSmith: the markdown pipeline, the Vite plugin, the style contract, a DocsShell layout, a 404 page, and a couple of sample pages.

			pnpm create svelte-docsmith my-docs
		

			npm create svelte-docsmith@latest my-docs
		

			yarn create svelte-docsmith my-docs
		

			bun create svelte-docsmith my-docs
		

Then install dependencies and start the dev server:

			cd my-docs
npm install
npm run dev
		

That is the whole setup. Skip ahead to Writing pages to start authoring. The rest of this page covers adding DocSmith to a project you already have.

Add to an existing project

Svelte DocSmith is a SvelteKit library. Install it with your package manager of choice:

			pnpm add -D svelte-docsmith
		

			npm install -D svelte-docsmith
		

			yarn add -D svelte-docsmith
		

			bun add -D svelte-docsmith
		

The CSS contract

Components are styled with Tailwind and shadcn design tokens. The whole contract is one import in your app’s stylesheet:

			@import 'tailwindcss';
@import 'svelte-docsmith/theme.css';
		

theme.css makes Tailwind scan the package (so the utility classes its components use are generated), defines the shadcn theme tokens (--background, --primary, --radius, and the rest) for :root and .dark, and pulls in the typography and animation plugins.

That single import is also the whole customization surface: redefine any token after it to rebrand the entire system. See Theming for the full token list and how dark mode is wired.

Next

With the package installed, continue to the Quick Start to wire up the pipeline and render your first page.