WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Modo oscuro con CSS conmutable
6627
codex
Publica tu código
Recomendado
23 September 2025
Fragmento de animación de carga descendente CSS
25 July 2025
Selector de temas de modo oscuro con LocalStorage
14 October 2024
Una plantilla de página web para "Anes Development" con un mensaje de bienvenida y navegación.
index.html
Copy
Webleb
Join our discord
here
styles.css
Copy
body { background: #f9f9f9; color: #202225; align-items:center; display: flex; justify-content:center; height: 100vh; } body div.darkmode { display: inline-block; font-size: 2rem; padding: 1rem 1rem 0.75rem 1rem; cursor: pointer; } body.dark .darkmode .light, body:not(.dark) .darkmode .dark { display: none; } .fa{ cursor: pointer; }
main.js
Copy
$(".darkmode").click(function(){ $("body").toggleClass("dark") .css( //3 $("body").hasClass("dark") ? {background:"#000000", color:"#f9f9f9"} : {background:"#f9f9f9", color:"#202225"} ); });