Awesome
<p align="center"> <img src="https://img.shields.io/github/release/etigerstudio/typora-misty-theme.svg" href="https://github.com/etigerstudio/typora-misty-theme/releases/latest" alt="Release"/> <img src="https://img.shields.io/github/downloads/etigerstudio/typora-misty-theme/total" href="https://github.com/etigerstudio/typora-misty-theme/releases/latest" alt="Download"/> </p>Yet another subtle
,elegant
& unobstructive
theme aimed at the philosophy of simplicity
, aesthetic
and readability
, for the awesome Typora markdown editor and reader.
Tweaked for both English🇺🇸 & 中文🇨🇳. Works on both macOS & Windows.
Ships with Light 🌞 & Dark 🌑 color schemes. Download
🙉 Quick Glance
Light mode:
<p align="center"> <img src="https://github.com/etigerstudio/typora-misty-theme/raw/master/assets/misty-light-demo.png" alt="misty-light-demo" width="887"/> </p>Dark mode:
<p align="center"> <img src="https://github.com/etigerstudio/typora-misty-theme/raw/master/assets/misty-dark-demo.png" alt="misty-dark-demo" width="887"/> </p>🔭 Full Preview
<details><summary>Show light preview:</summary> <p align="center"> <img src="https://github.com/etigerstudio/typora-misty-theme/raw/master/assets/light-preview.png" alt="light-preview" width="648"/> </p> </details> <details><summary>Show dark preview:</summary> <p align="center"> <img src="https://github.com/etigerstudio/typora-misty-theme/raw/master/assets/dark-preview.png" alt="dark-preview" width="648"/> </p> </details>🔌 Installation
Download theme stylesheets of the platform you work on and color schemes you like. Copy it into the themes folder of Typora. Select theme name (eg. Misty Light Macos
) form the theme list to apply it. You may restart Typora once to help it discover the theme file.
For detailed reference, please see Install Theme.
🔨 How to Build
Misty is now written in SASS and the dist\
folder has been dropped from this repo. You may directly download distributed builds from release portal.
If you need to manually build the theme, with npm
installed, you could easily compile source SCSS to CSS Typora could read by running:
npm i --only=dev
npx gulp build
Compiled & optimized CSS files can then be found in dist\
:
[16:06:41] Using gulpfile ~/typora-misty-theme/gulpfile.js
[16:06:41] Starting 'build'...
[16:06:41] Finished 'build' after 227 ms
🖥 Compatibility
Misty is both test on macOS 10.13.6
to 10.15.3
and Windows 10 version 1909
. However, it has not been tested on Linux
thoroughly yet and will be tested in future.
Any test on Windows or Linux and any issue feedback will be welcome.
Font fallback list is tweaked for both English and Chinese, on both macOS and Windows. Font weight values have been slightly adjusted on Windows to match Windows-specific rendering characteristic.
🧟 Known Issues
Borders of buttons on all platforms and context menu on Windows are too bright in Dark mode.- Text color & Background of Preference Panel on Windows is too bright in Dark mode.
- Colors and layouts of math block on all platforms need to be inspected and tuned.
- Font fallback list and rendering effect has not been tested on Linux.
- Text thickness & font family rendered may not be consistent on Windows of different builds or in different languages.
Colors of tooltips need to adjusted in dark mode.
Brought to you with ❤️ by E-Tiger Studio, 2017-2020.