Docs Philosophy
Compared with shadcn-svelte
A different layer. shadcn-svelte distributes source-owned UI components and design patterns; Svelte Lean is a native-first runtime architecture with optional source-owned styles. They can coexist in one application.
On this page
Two layers
shadcn-svelte is a distribution model for user interface components: the code is copied into the application, which then owns and edits it, and the components carry a design system with them. The value is ownership of the whole component, look and behavior together.
Svelte Lean is a runtime architecture. Its products decide what the browser owns and what a shared behavior owns, ship that behavior as a maintained package, and offer the styles as files the application may own. The value is the absence of runtime the platform makes unnecessary, with the accessibility-sensitive part kept in one place.
Where the line is
Svelte Lean draws its ownership line between look and behavior on purpose. Styles and recipes may be copied and edited; the behavior engine is not copied, because a focus or keyboard bug fixed upstream must reach every project through npm rather than through a diff each project applies by hand. That is recorded in ADR 0005 as a rejected alternative for behavior code, not as a judgement of the copy model for components in general.
The slean add command that would copy a stylesheet into the application is not
built; today the copy is a file operation, and the package stylesheet or your own CSS are the
two working paths (Owned styles).
Coexistence
An application can use copied components for parts of its interface and protocol markup for
others. A native dialog on the protocol has no runtime and no provider; a page that mixes the
two does not double any listener, because the Svelte Lean behaviors respond only to roots marked
with data-slean. What each approach cannot do is share one widget: a component is
owned as a whole or written on the protocol.
What this page does not claim
Nothing about shadcn-svelte's current behavior, its styling output or its accessibility. Its interactive components are built on Bits UI, so the behavior JavaScript a page ships with them is the Bits UI cost measured on Compared with Bits UI; the styles and the copied component files are not measured, because they are yours to change. Its own documentation is the source for what it does. Choose the layer that matches what your team wants to own, and do not force a competition between them.