Catppuccin for mdBook

Previews

🌻 Latte

🪴 Frappé

🌺 Macchiato

🌿 Mocha

Usage

Important

The mdbook-catppuccin rust package has been deprecated. For further information on why this decision was made, please refer to catppuccin/mdBook#107

Please follow the instructions below to install the Catppuccin theme for mdBook.

1. Initialise your mdBook with the theme files:

   mdbook init --theme <name>

2. Enter the book directory and remove all theme files except index.hbs:

   cd <name>
   # Remove all files except index.hbs
   find ./theme -type f ! -name 'index.hbs' -delete
   # Remove the left over empty directories
   rm -d fonts css

3. Download the catppuccin.css file from the latest GitHub release to the theme directory.

   See the Supported Plugins section below for integrations with other mdBook plugins.

4. Update additional-css key within the book.toml as shown below

   [output.html]
   -additional-css = []
   +additional-css = ["./theme/catppuccin.css"]

5. Edit the index.hbs file to include the Catppuccin flavors:

   - <li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
   - <li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
   - <li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
   - <li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
   - <li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
   + <li role="none"><button role="menuitem" class="theme" id="latte">Latte</button></li>
   + <li role="none"><button role="menuitem" class="theme" id="frappe">Frappé</button></li>
   + <li role="none"><button role="menuitem" class="theme" id="macchiato">Macchiato</button></li>
   + <li role="none"><button role="menuitem" class="theme" id="mocha">Mocha</button></li>

   Additionally, you can use default-theme and preferred-dark-theme keys for setting default light/dark mode themes in your book.toml.

   E.g. To set the default theme to latte and default dark mode to mocha:

   [output.html]
   + default-theme = "latte"
   + preferred-dark-theme = "mocha"

6. Build using mdbook build and enjoy your new Catppuccin flavors!

Supported Plugins

This theme also generates CSS files to style elements added by other mdBook plugins. We support the following list of plugins:

Plugin	CSS File
mdbook-admonish	catppuccin-admonish.css
mdbook-alerts	catppuccin-alerts.css

The CSS file(s) can be downloaded and added to the additional-css key shown in step 4. of the Usage section.

Development

1. Clone the repository and navigate to the repository root.

   git clone https://github.com/catppuccin/mdbook
   cd mdbook

2. Generate the CSS files:

   pnpm install
   pnpm run build

Acknowledgement

mdbook-admonish for inspiration on the install command for the now deprecated mdbook-catppuccin binary.

💝 Thanks to

• Hamothy
• winston

 

Copyright © 2021-present Catppuccin Org