Skip to content

nofishleft/rose-pine-chatterino

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

Rosé Pine for Chatterino

All natural pine, faux fur and a bit of soho vibes for the classy minimalist

Usage

  1. Open Chatterino's folder
  2. Open Themes subfolder
  3. Paste in desired theme .json file
  4. Open Chatterino
  5. Open setttings
  6. Under interface, theme, select Custom: <Theme Name>

Gallery

Rosé Pine with Chatterino

Rosé Pine with Theme Editor

Thanks to

Contributing

See wiki for details on how chatterino is themed. Most importantly, transparent colors are specified as ARGB (e.g. #AARRGGBB). If you want a transparency of 0x50 and a color of $surface, you should specify "#50$surface".

Additionally Chatterino Theme Creator by doge41732 can be used for fast iteration with the following caveats:

  • Won't be able to directly edit the template, instead you'll have to edit the built files, then diff these and apply the changes to the template, converting the colors back into their names (e.g. base, rose, text).
  • Has some issues where the previews do not match the App (hover & focus variants of tab bar especially)
  • Sometimes outputs colors that has transparency correctly as ARGB, and sometimes incorrectly as RGBA.
  • Some themeable properties aren't shown in the editor (e.g. color.splits.messageSeperator)

Modify template.json using Rosé Pine variables, then build variants using @rose-pine/build:

npx @rose-pine/build@0.9.1 -t template.json -o dist -f hex-ns

Generated by @rose-pine/build@0.9.1