Install Theme

1. Install the theme package to your project with your preferred package manager:

   npm

   npm i @catppuccin/starlight

   pnpm

   pnpm add @catppuccin/starlight

   yarn

   yarn add @catppuccin/starlight

2. Add the theme to your Starlight config.

   astro.config.mjs

   import catppuccin from "@catppuccin/starlight";
   
   export default defineConfig({
     // ...
     integrations: [
       starlight({
         // ...
         plugins: [
           catppuccin()
         ]
       })
     ]
   })

3. (Optional) Customize your theme for light/dark mode using flavor and accent.

   astro.config.mjs

   import catppuccin from "@catppuccin/starlight";
   
   export default defineConfig({
     // ...
     integrations: [
       starlight({
         // ...
         plugins: [
           catppuccin({
             dark: { flavor: "macchiato", accent: "sky" },
             light: { flavor: "latte", accent: "sky" }
           })
          ]
       })
     ]
   })