Catppuccin for UnoCSS

Previews

🌻 Latte

🪴 Frappé

🌺 Macchiato

🌿 Mocha

Usage

1. Install the npm package @catppuccin/unocss

   npm install -D @catppuccin/unocss
   # or
   pnpm add -D @catppuccin/unocss
   # or
   yarn add -D @catppuccin/unocss
   

2. Add the preset to your UnoCSS configuration

   // uno.config.ts
   import { presetWind4, defineConfig } from 'unocss';
   import presetCatppuccin from '@catppuccin/unocss';
   
   export default defineConfig({
     presets: [
       presetWind4(),
       presetCatppuccin({
         // options
       })
     ]
   });
   

3. Configure the preset if needed. Refer to the FAQ for documentation

🙋 FAQ

• Q: Where can I find the documentation?
  A: Documentation can be found at https://unocss.catppuccin.com/docs

💝 Thanks to

• tuhana

 

Copyright © 2021-present Catppuccin Org