- Open Settings in Obsidian
- Go to Appearance
- Under Themes, click Browse
- Search for
Firefly - Click Use and you're done! 🎉
- Download the
obsidian.cssfile from this repository - Rename it to
Firefly.cssto ensure a unique name - Place it in your vault's
/.obsidian/themes/directory - In Obsidian, go to Settings → Appearance
- Set Base mode to
Dark mode - Enable Custom CSS
- Set Base mode to
- Under Themes, select
Fireflyfrom the dropdown - Enjoy! 🎉
Firefly is a clean and minimal theme for Obsidian, designed to offer a focused writing environment with subtle color accents.
It supports both dark and light modes, and provides slightly different styles for edit and preview modes to enhance readability and UX.
The goal was to combine the feel of a code editor in editing mode with a more refined, blog-like feel in reading mode.
Firefly introduces an experimental feature called code-style tags (CSTs), which allow you to style content blocks using custom labels.
Usage:
Like code blocks, CSTs begin with triple backticks, but instead of a language, use a tag like _note.
Wrap content like this:
```_note
This is a note block.
```
In preview mode, this renders as a styled note box with a drop shadow and a red #Note label.
This is still experimental — feedback welcome!
This theme uses the beautiful Inter and JetBrains Mono fonts.
For best results, install them locally on your system.
Firefly is still evolving — and you can be part of shaping it!
If you have ideas for new features, styling tweaks, or want to help implement missing parts: pull requests are very welcome 🙌
- Fork the repository
- Create a feature branch
- Submit a PR with a short description
Let's build something awesome together!
Firefly was inspired by and blends elements of these amazing themes:
This theme is released under the CC0-1.0 License — feel free to use, change, remix, or share without restrictions.