Catppuccin Palettes

Available formats

• Node Package
• CSS
• Gimp
• Krita
• Inkscape
• Aseprite/LibreSprite
• Affinity
• PNG
• Sass

Usage

Node Package

npm install @catppuccin/palette

Example: test.js

import {variants, labels} from '@catppuccin/palette'

console.log(variants.latte.lavender.hex) // #7287FD
console.log(labels.base.macchiato.hex) // #24273A

CSS

Import the palettes:

@import "@catppuccin/palette/style"		/* directly from the file */
@import url('https://unpkg.com/@catppuccin/palette@0.1.4/css/catppuccin.css');		/* or using unpkg.com */

Then use them:

body {
	color: var(--ctp-mocha-text);
	background: var(--ctp-frappe-base);
}

Gimp

1. Clone this repository locally
2. Navigate to Edit > Preferences > Folders > Palettes in GIMP
3. Select the folder with the 'x' and press "Show file location in the file manager" (the rightmost button)
4. Copy "Catppuccin.gpl" to this folder

Krita

1. Clone this repository locally
2. Navigate to Settings > Dockers > Palette in Krita
3. Open the "Choose Palette" button in the bottom left corner of Palette docker
4. Select "Import a new palette from file"
5. Open Catppuccin.kpl from the dialog that appears

Inkscape

1. Clone this repository locally
2. Navigate to Edit > Preferences > System > User palettes in Inkscape
3. Press the "Open" button next to the folder path
4. Copy "Catppuccin.gpl" to this folder

Aseprite

1. Clone this repository locally
2. Open Palette Options
3. Select "Load Palette" from the menu
4. Open Catppuccin.ase from the dialog that appears

💝 Thanks to

• Gingeh
• TheExistingOne
• Andreas Grafen
• Pocco81

 

Copyright © 2021-present Catppuccin Org