Easily switch themes in your website

• Themes switch without page reload
• Quick debugging
• Add your own themes and some themes ready-made in themes folder
• Minified version of index.js automatically available in index.min.js
• And many more features coming

If you are looking for help with v0, you should head to the main branch. This branch is developing code for v1 release.

See docs folder.

See live demo

Click on "Dark theme" at the bottom, refresh the page, you see the page is default now set to dark theme.

These are the frequently asked questions:

This is a basic JS code, that stores the theme name in a cookie that stays for 10 days and adds the theme name to the data-theme attribute of the html tag.

You need to know CSS for that.

1. Think of a cool theme name
2. To select the theme in CSS, use [data-theme="themeName"] where themeName is your theme name. And design styles for the theme by selecting it.
3. To add a button for user to switch the theme (use the html a tag e.g. <a href="javascript:SwitchThemeJS.switch('dark');">Dark theme</a>)
4. Add onload="SwitchThemeJS.get();" to your body tag
5. Add <script async defer src="https://cdn.jsdelivr.net/gh/PuneetGopinath/switch-theme-js@v1-dev/src/index.min.js"></script> in the head tag.
6. Set a default theme by adding data-theme attribute to html tag, with your default theme name as value
7. That's all, test it out in your website, or submit a bug report for us to Analyse the bug.

You can find the contributing guidelines here

See CHANGELOG.md

👏 A big thank you goes to all the supporters of this project!

You prove that the switch-theme-js Action has some value for you!

Thanks to all contributors again!