Light/Dark mode

[jaspermayone]

No description provided.

[jaspermayone]

https://www.instagram.com/reel/C-k49eCSFOX/?igsh=MTVoanNxamNvODk4Mw==

Instagram

Code with Ania Kubow on Instagram: "You can now create light and dark mode with just 2 Iines of CSS! This is a game changer for anyone who has tried to create light and dark mode before, writing lots of lots of code for your apps to turn to a darker theme, when viewed in dark mode on your operating system - or of course turn to lighter colours, when viewed in light mode. Now by using the light-dark method in css, you can pass through a light colour of your choice, and a dark colour of your choice! You can do so for many elements, such as the body element right here. All the first arguments will be lumped into your light mode theme. Just make sure to set the root also. And voila! Get the HTML and CSS from below and don’t forget to save this tip and follow for more.

Since May 2024, this feature works across the latest devices and browser versions.

— HTML —

View me in Light Mode and then Dark Mode on your OS

— CSS —
:root {
color-scheme: light dark;
}

body {
background-color: light-dark(#fff, #444);
color: light-dark(#444, #fff);
}

#devcommunity #csstips #coding #100daysofcode #webdeveloper"

9,934 likes, 85 comments - aniakubow on August 12, 2024: "You can now create light and dark mode with just 2 Iines of CSS! This is a game changer for anyone who has tried to create light and dark mode before, writing lots of lots of code for your apps to turn to a darker theme, when viewed in dark mode on your operating system - or of course turn to lighter colours, when viewed in light mode.
Now by using the light-dark method in css, you can pass through a light colour of your choice, and a dark colour of your choice! You can do so for many elements, such as the body element right here. All the first arguments will be lumped into your light mode theme. Just make sure to set the root also.
And voila! Get the HTML and CSS from below and don’t forget to save this tip and follow for more.

Since May 2024, this feature works across the latest devices and browser versions.

— HTML —

View me in Light Mode and then Dark Mode on your OS

— CSS —
:root {
color-scheme: light dark;
}

body {
background-color: light-dark(#fff, #444);
color: light-dark(#444, #fff);
}

#devcommunity #csstips #coding #100daysofcode #webdeveloper".

[aramshiva]

In tailwind you can just do dark:tagOn Sep 30, 2024, at 8:25 PM, Jasper Mayone ***@***.***> wrote: https://www.instagram.com/reel/C-k49eCSFOX/?igsh=MTVoanNxamNvODk4Mw== InstagramCode with Ania Kubow on Instagram: "You can now create light and dark mode with just 2 Iines of CSS! This is a game changer for anyone who has tried to create light and dark mode before, writing lots of lots of code for your apps to turn to a darker theme, when viewed in dark mode on your operating system - or of course turn to lighter colours, when viewed in light mode. Now by using the light-dark method in css, you can pass through a light colour of your choice, and a dark colour of your choice! You can do so for many elements, such as the body element right here. All the first arguments will be lumped into your light mode theme. Just make sure to set the root also. And voila! Get the HTML and CSS from below and don’t forget to save this tip and follow for more. Since May 2024, this feature works across the latest devices and browser versions. — HTML — View me in Light Mode and then Dark Mode on your OS — CSS — :root { color-scheme: light dark; } body { background-color: light-dark(#fff, #444); color: light-dark(#444, #fff); } #devcommunity #csstips #coding #100daysofcode #webdeveloper"9,934 likes, 85 comments - aniakubow on August 12, 2024: "You can now create light and dark mode with just 2 Iines of CSS! This is a game changer for anyone who has tried to create light and dark mode before, writing lots of lots of code for your apps to turn to a darker theme, when viewed in dark mode on your operating system - or of course turn to lighter colours, when viewed in light mode. Now by using the light-dark method in css, you can pass through a light colour of your choice, and a dark colour of your choice! You can do so for many elements, such as the body element right here. All the first arguments will be lumped into your light mode theme. Just make sure to set the root also. And voila! Get the HTML and CSS from below and don’t forget to save this tip and follow for more. Since May 2024, this feature works across the latest devices and browser versions. — HTML — View me in Light Mode and then Dark Mode on your OS — CSS — :root { color-scheme: light dark; } body { background-color: light-dark(#fff, #444); color: light-dark(#444, #fff); } #devcommunity #csstips #coding #100daysofcode #webdeveloper". —Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[jaspermayone]

Oh perfect!