• 891: Light and Dark Mode

  • Apr 7 2025
  • Duración: 27 m
  • Podcast

891: Light and Dark Mode

Escúchala gratis

Ver detalles del espectáculo

  • Resumen

  • Light mode? Dark mode? Scott and Wes break down the best ways to implement theme switching in CSS, from prefers-color-scheme to manual overrides. Plus, tips on handling shadows, icons, and the dreaded flash of dark mode!

    Show Notes
    • 00:00 Welcome to Syntax!
    • 01:05 Brought to you by Sentry.io.
    • 02:06 Light and dark mode, things to consider.
    • 02:31 Light and dark mode from scratch.
      • drop-in.css.
      • 04:41 Calculations vs assigned color.
      • 05:32 color-mix and relative color.
      • 08:15 Foreground and background variables.
        • –tint-or-shade: color-mix(in oklab, var(–fg), transparent 95%);
        • –tint-or-shade-harder: color-mix(in oklab, var(–fg), transparent 90%);
      • 09:13 Setting color scheme.
      • 12:38 light-dark function in CSS.
    • 15:48 Manually setting dark mode.
      • 18:43 The challenges with shared caching.
      • 19:33 Tailwind CSS implementation.
        • Tailwind dark-mode.
    • 19:52 Shoehorning in dark mode.
    • 22:25 Other things to consider.
      • 22:28 Color contrast.
        • Lea Verou contrast-color.
      • 24:39 Logos.
      • 25:22 Icons and images.
      • 26:20 Accessibility.
        • Polypane.
    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads
    Más Menos
Más Menos
adbl_web_global_use_to_activate_webcro768_stickypopup

Lo que los oyentes dicen sobre 891: Light and Dark Mode

Calificaciones medias de los clientes

Reseñas - Selecciona las pestañas a continuación para cambiar el origen de las reseñas.

Reseñas de Audible.com

Opiniones de Amazon
No hay comentarios disponibles