https://github.com/catppuccin/element
💫️ Soothing pastel theme for Element
https://github.com/catppuccin/element
catppuccin element hacktoberfest matrix theme
Last synced: 9 months ago
JSON representation
💫️ Soothing pastel theme for Element
- Host: GitHub
- URL: https://github.com/catppuccin/element
- Owner: catppuccin
- License: mit
- Created: 2022-09-17T16:44:27.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-05-19T22:16:33.000Z (11 months ago)
- Last Synced: 2025-05-19T23:26:23.882Z (11 months ago)
- Topics: catppuccin, element, hacktoberfest, matrix, theme
- Homepage:
- Size: 498 KB
- Stars: 56
- Watchers: 4
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README

Catppuccin for Element
## Previews
🌻 Latte

🪴 Frappé

🌺 Macchiato

🌿 Mocha

## Usage
There are several ways to install these themes.
### Use an instance of Element which has `Labs` enabled
If you use an instance of Element which has Labs enabled, head over to the Labs
tab in Settings and turn on "Support adding custom themes".
For example, to use Catppuccin Mocha Mauve, you can paste the following URL into the "Custom theme URL" field:
```
https://element.catppuccin.com/mocha/mauve.json
```
See the [themes](./themes) directory for the available flavour and accent combinations.
### Self hosted Element or Element Desktop
If you are hosting an instance yourself or use Element Desktop, then this theme
can be added by placing the [config.json](./config.json) file in Element's
config directory. The possible locations are:
- Windows: `%APPDATA%\$NAME\config.json`
- Linux: `$XDG_CONFIG_HOME/$NAME/config.json` or `~/.config/$NAME/config.json` or `~/.var/app/im.riot.Riot/config/$NAME/config.json` if you are using the Flatpak version.
- macOS: `~/Library/Application Support/$NAME/config.json`
where the `$NAME` is usually `Element`. If you use the `--profile $PROFILE` flag, then the `$NAME` becomes `Element-$PROFILE`.
Then enable the "Support adding custom themes" option in the Labs section of the
Settings. The themes will then appear in the Appearance tab of the Settings.
## 🙋 FAQ
- Q: **"How can I change the font?"** \
A: Fonts can be changed by editing the [config.json](./config.json) file in the following manner:
```json
"is_dark": true,
"fonts": {
"faces": [
{
"font-family": "Inter",
"src": [{"url": "/fonts/Inter.ttf", "format": "ttf"}]
}
],
"general": "Inter, sans",
"monospace": "'Courier New'"
},
```
## 💝 Thanks to
- [ghostx31](https://github.com/ghostx31)
Copyright © 2021-present Catppuccin Org