Cómo diseñar en modo oscuro

Desatura los colores la subida, pero aquí va mi aporte.

Como proyecto decidí aplicar un darkmode a mi portfolio personal.
Quedo atento a sus feedbacks.!

Soy programador frontend y en este momento me encuentro iniciando un proyecto y preparandolo para que tenga un Dark Mode.
Quería darles mi punto de vista de lo que implica programar un modo oscuro:

He visto muchas apps que tienen un dark mode pero en el botón para activarlo dice, entre paréntesis, “beta” o “versión de prueba”. Esto ocurre por que son apps con ya algunos años en el mercado y un día tomaron la decisión de programar su modo oscuro. Al ser apps grandes, el trabajo técnico de prepararlo y tener que refactorizar mucho código, sobre todo CSS, es muy laborioso. Lleva su tiempo.

Lo importante de tener una app con ambos modos, light y dark, es llevar una buena Arquitectura CSS. Tal vez mucha gente se ría cuando se habla de arquitectura CSS o no tengan conciencia de lo importante que es reutilizar nuestros estilos, escribir la menor cantidad de código posible para estilizar nuestra web. No es muy recomendable tener hojas de estilos de 3000 líneas, lo digo por experiencia.
Aquí recomiendo el uso de preprocesadores como SASS o LESS, sacarle provecho a las variables de CSS que existen pero poco se usan. Si el proyecto está iniciando, recomiendo tomarse el tiempo en evaluar esto y preparar las hojas de estilos de manera que sea escalable y permita hacer este switch entre modos. Es mejor perder un poco de tiempo al iniciar el proyecto que meses en refactorizarlo para lograr este proposito.
Gracias por el curso!

Yo usé los conocimientos aprendidos en el curso para el desarrollo de un Dashboard (Aún sigue en proceso)

Así va quedando mi diseño:

Muchas gracias Meri por el curso, toca de mi parte profundizar más en otros temas como accesiblidad y usabilidad 👏

Muchas gracias por el curso, me ha sido de gran utilidad para poder diseñar productos en Dark Mode con las mejores prácticas. Es de gran relevancia, puesto que cada vez más apps e interfaces web se valen de este modo de color para presentar sus productos y servicios a usuarios exigentes, que buscan presentaciones de mayor estatus, con problemas visuales o con vista cansada.

Gracias , corto y práctico.
Tener en cuenta
-accesibilidad
-usabilidad
-variables de entorno.