Change the color of a webpage dynamically using JS and CSS
Here’s how to dynamically change a web page’s colors using the CSS filter property and JavaScript:
<a href='javascript:document.querySelector("html").setAttribute("style","filter: saturate(60%) brightness(80%);")'>
pastel
</a>
<a href='javascript:document.querySelector("html").setAttribute("style","filter: grayscale(100%); ")'>
grayscale
</a>
<a href='javascript:document.querySelector("html").setAttribute("style","filter: ")'>
normal
</a>
→ Here's my latest YouTube video
→ Get my JavaScript Beginner's Handbook
→ I wrote 17 books to help you become a better developer, download them all at $0 cost by joining my newsletter
→ JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025