https://github.com/hsins/hackmd-themes
π¨ Colorful and pretty themes for HackMD. Most of them are ported from Typora Themes and Obsidian Themes.
https://github.com/hsins/hackmd-themes
hackmd hackmd-theme
Last synced: 6 months ago
JSON representation
π¨ Colorful and pretty themes for HackMD. Most of them are ported from Typora Themes and Obsidian Themes.
- Host: GitHub
- URL: https://github.com/hsins/hackmd-themes
- Owner: Hsins
- License: apache-2.0
- Created: 2022-03-07T06:11:22.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-03-10T09:04:33.000Z (almost 4 years ago)
- Last Synced: 2025-04-09T03:35:20.518Z (10 months ago)
- Topics: hackmd, hackmd-theme
- Language: CSS
- Homepage:
- Size: 97.7 KB
- Stars: 26
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
[](./LICENSE)

# HackMD Themes
π¨ _Colorful and pretty themes for [HackMD](https://hackmd.io/). Most of them are ported from [Typora Themes](https://theme.typora.io/) and [Obsidian Themes](https://github.com/kmaasrud/awesome-obsidian#themes)._
[](https://hackmd.io/@themes)
[](./README_zh-TW.md)
## Usage
According to [Use Custom CSS Style in HackMD](https://hackmd.io/@hackmd/hackmd-new-blog#%E5%9C%A8-HackMD-%E8%87%AA%E8%A8%82%E7%AD%86%E8%A8%98%E6%A8%A3%E5%BC%8F%E8%A1%A8) and [Share CSS Style with Embedding Feature](https://hackmd.io/@hackmd/hackmd-new-blog#%E4%BD%BF%E7%94%A8%E5%85%A7%E5%B5%8C%E7%AD%86%E8%A8%98%E5%8A%9F%E8%83%BD%E5%85%B1%E7%94%A8%E7%AD%86%E8%A8%98%E6%A8%A3%E5%BC%8F%E8%A1%A8). I've published these themes for embedding use. Just use the syntax below to include the theme you need in your HackMD document.
```
{%hackmd @themes/dracula %}
```
The name of published themes will follow the naming convention `THEME_NAME` or `THEME_NAME-STYLE` (Note that `THEME_NAME` and `STYLE` should be in lowercase).
## Themes
Name
Preview
Embed Snippet
Dracula
[DEMO](https://hackmd.io/@themes/demo-dracula)

```
{%hackmd @themes/dracula %}
```
Notion
[DEMO](https://hackmd.io/@themes/demo-notion)

```
{%hackmd @themes/notion %}
```
OrangeHeart
[DEMO](https://hackmd.io/@themes/demo-orangeheart)

```
{%hackmd @themes/orangeheart %}
```
## Contribution
The syncing process of themes is handled by [HackMD API](https://hackmd.io/@hackmd-api/developer-portal/) and [GitHub Actions](https://github.com/features/actions). We can modify the `*.css` file inside `./styles` directory and then actions will automatically minimize the file and upload to HackMD. Check [`update-themes.yaml`](./.github/workflows/update-themes.yaml) for this workflow.
This project exists thanks to all the people who contribute:
## Credits
Themes are ported from [Typora Themes](https://theme.typora.io/) and [Obsidian Themes](https://github.com/kmaasrud/awesome-obsidian#themes). Credited to following people:
- **Dracula Theme**: [dracula](https://github.com/dracula), [Teyler7](https://github.com/Teyler7)
- **Notion Theme**: [adrian-fuertes](https://github.com/adrian-fuertes)
- **OrangeHeart Theme**: [zhning12](https://github.com/zhning12), [evgo2017](https://github.com/evgo2017)
## Other HackMD Themes
- [Neko250/hmd-themes](https://github.com/Neko250/hmd-themes)
- [Yukaii/hackmd-themes](https://github.com/Yukaii/hackmd-themes)
## License
Licensed under the Apache License, Version 2.0. Copyright Β© 2022-present [H.-H. Peng](https://github.com/Hsins).
Assembled with β€οΈ in Taiwan.