# Using cascivo with Next.js (App Router / RSC) cascivo works in Next.js App Router projects out of the box: components ship with `'use client'` **preserved in the published bundle**, so React Server Components treat them as client components without any wrapper on your side. This page covers the wiring and how the server/client split falls out. Prerequisite reading: [GETTING-STARTED.md](/docs/getting-started.md) for the two install paths. Everything below applies to both; snippets use the prebuilt `@cascivo/react` package. ## Install ```sh pnpm add @cascivo/react @cascivo/themes @preact/signals-react ``` ## Import the themes CSS in the root layout Do this once, in a **Server Component** — `app/layout.tsx` is the natural place. Next.js supports global CSS imports in Server Components, and this keeps the theme out of every client bundle: ```tsx // app/layout.tsx — a Server Component (no 'use client') import '@cascivo/themes/light-dark.css' // tokens (once) + base typography + light & dark export default function RootLayout({ children }: { children: React.ReactNode }) { return ( {children} ) } ``` `data-theme` on `` themes the whole app; it can also scope any subtree (`