KitBook

Documentation, Prototyping, Inspection & Testing Workbench Tool for Svelte built with SvelteKit that lets you rapidly build, document, and test components. Inspired by Svench and [others].

Best Features

• File-based sidebar tree structure, with optional prefixed numbers to adjust ordering of your docs
• Iframe isolation for easy media query testing
• [Variants] and [Compositions] are [SSR rendered and then hydrated client-side] just like the rest of your SvelteKit app
• Quickly create and compare [Variants] of a component via typesafe exported prop objects in a colocated .variants.ts file that can also be used for testing, especially visual regression tests of your components.
• Use [markdown] to enable easy documenation as you build
• All SvelteKit-only imports are automatically available because it runs inside your regular SvelteKit app. No need for any special mocks or compatibility hacks.
• Build components using the same context as your main app, like i18n.
• Foam based automatic updating [wiki-links] for easy linking between pages within your Kitbook that will never get out of date.
• Conveniently view and edit component state from your app and quickly create component variants the [Viewer] tool.
• Great [i18n] support
• Unlimited [Visual Regression Testing] with Playwright

Start Building!

Learn how to [Get Started], view some [Examples], hint: you're looking at one, or open the starter template in Stackblitz: