Skip to content

catppuccin/starlight

Logo
Catppuccin for Starlight

Previews

🌻 Latte
πŸͺ΄ FrappΓ©
🌺 Macchiato
🌿 Mocha

Usage

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

    npm install @catppuccin/starlight
    pnpm add @catppuccin/starlight
    yarn add @catppuccin/starlight
  2. Add the theme to your Starlight config.

    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.

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

Development

Important

catppuccin/whiskers is required to re-generate the themes directory.

pnpm install
pnpm build

πŸ’ Thanks to

Β 

Copyright Β© 2021-present Catppuccin Org