DEV Community

Cover image for Dark and light theme with switch for docsify sites (also supports docsify-themeable)
Boopathi Kumar
Boopathi Kumar

Posted on • Updated on

Dark and light theme with switch for docsify sites (also supports docsify-themeable)

About me

Hi imboopathikumar working as Full stack JavaScript developer also in AWS. I personally using docsify for generating documentation websites and I am big fan of dark mode. So I desided to create a plugin docsify-darklight-theme for docsify generated sites to switch between dark-mode and light mode. This is my first open source project and npm package

What is docsify

docsify.js is static website generator using Markdown. It parses your Markdown files and displays them as a website less than a minute instead of generating static html files. Using various plugin support, You can create better looking website with docsify.

docsify-darklight-theme plugin

docsify-darklight-theme which is a simple and highly customizable theme plugin for the documentation websites generated using docsify.js. Using this theme, documents will have a theme switcher to switch between dark-mode and light-mode also comes with starter kit. Now available through npm & CDN. Try now for your docsify websites. It also supports with docsify-themeable

docsify-themeable is a simple theme system for docsify.js. It have Legacy browser support (IE10+).

#Features

  • Default theme mode detection in supported browser versions.
  • Theme Switcher.
  • Switcher support for docsify-themeable. View setup guide here.
  • Tooltip view for long sidebar items.
  • Themes are customizable based on your color preferences.
  • Option for other plugins to support (Dark/Light) mode. View setup guide here.
  • Preferences can be modified directly in window.$docsify configuration object.
  • Using configuration objecttoogle icons can be configured based on your preference.
  • Default theme(Dark/Light) can be configured based on your needs.
  • Themes are remembered and retrieved from local storage.
  • Redesigned search box.

#Installation

You can use docsify-darklight-theme in three ways

Also it provides theme support for other plugins which are developed for docsify.js

#Finally

Try docsify-darklight-theme for your docsify generated websites and share your thoughts.

Thank you everyone for the support

Follow me on twitter @imboopathikumar and @docsify-darklight-theme

Top comments (0)