HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Theme switch</title> <script src="https://unpkg.com/@mahozad/theme-switch"></script> <link rel="stylesheet" href="styles.css"> </head> <body> <theme-switch></theme-switch> </body> </html>
CSS
html { width: 100%; height: 100%; display: flex; background: #fff1a4; align-items: center; justify-content: center; transition: background-color 300ms ease; } html[data-theme="dark"] { background: #a8d8ff; } theme-switch { --theme-switch-icon-color: #121314; width: 256px; }
JavaScript
/* No JavaScript code used */