2023-06-08 16:44:41 +02:00
# bootstrap-auto-dark-mode
2023-06-08 17:09:24 +02:00
2023-06-18 10:15:15 +02:00
This script adds the missing auto-dark mode to the new theme feature of Bootstrap 5.3.
2023-06-08 17:09:24 +02:00
2023-06-18 10:15:15 +02:00
It switches the Bootstrap theme automatically between light and dark mode, depending on the system settings, if you set the `data-bs-theme` attribute of your < html> to `auto` .
2023-06-08 17:09:24 +02:00
2025-01-11 21:08:33 +01:00
## References
- [Demo page ](https://shaack.com/projekte/bootstrap-auto-dark-mode/ )
- [GitHub repository ](https://github.com/shaack/bootstrap-auto-dark-mode )
- [npm package ](https://www.npmjs.com/package/bootstrap-auto-dark-mode )
2023-06-08 17:09:24 +02:00
## Usage
2023-06-18 10:15:15 +02:00
Use it by just including `bootstrap-auto-dark-mode.js` in your header and setting `data-bs-theme` to `auto` .
2023-06-08 17:09:24 +02:00
```html
2023-06-18 10:16:13 +02:00
< html lang = "en" data-bs-theme = "auto" >
2023-06-18 10:15:15 +02:00
< head >
2024-03-04 10:45:32 +01:00
<!-- your code -->
2023-06-18 10:15:15 +02:00
< script src = "./src/bootstrap-auto-dark-mode.js" > < / script >
< / head >
<!-- your code -->
2024-03-04 10:45:32 +01:00
<!-- […] -->
2023-06-08 17:09:24 +02:00
```
2025-01-11 21:08:33 +01:00
---
Find more high quality modules from [shaack.com ](https://shaack.com )
on [our projects page ](https://shaack.com/works ).
