Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mlascurain/toggle-dark-mode
Web Component, using LocalStorage, ShadowDOM and Custom HTML Elements
https://github.com/mlascurain/toggle-dark-mode
custom-elements javascript localstorage shadow-dom web-components
Last synced: 10 days ago
JSON representation
Web Component, using LocalStorage, ShadowDOM and Custom HTML Elements
- Host: GitHub
- URL: https://github.com/mlascurain/toggle-dark-mode
- Owner: mLascurain
- Created: 2024-08-27T20:27:44.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-09-25T23:02:31.000Z (5 months ago)
- Last Synced: 2025-02-01T17:45:32.097Z (10 days ago)
- Topics: custom-elements, javascript, localstorage, shadow-dom, web-components
- Language: JavaScript
- Homepage:
- Size: 5.86 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Toggle-Dark-Mode
![](https://github.com/user-attachments/assets/41e71754-592f-4d89-8b53-d0505fa04020)
Clone the repository or download the file and add the following lines into your html file
![WhatsApp Image 2024-08-27 at 20 37 17](https://github.com/user-attachments/assets/549d64d4-527f-4955-8f07-b0b71b8249a2)
```
```
After that create your styles for dark mode and light mode in the dark-mode/light-mode classes
If you want to change the style of the button just comment all the styles in the js file.