Dark Mode Images
Read the README.md for more information on these concepts.
Apply CSS to the image
Image:
"A Bug"
© Vlad Gerasimov - http://vlad.studio
opacity: 0.75;
(On black background)
filter: grayscale(50%);
filter: brightness(.8) contrast(1.2)
Use Responsive Images
Image:
"When The Night Comes"
"When The Day Comes"
© Vlad Gerasimov - http://vlad.studio
Responsive Images
SVG ...
... as in-line DOM elements that can be styled with CSS.
As in-line <svg>
It's not only color SVG attributes (e.g. `fill` & `stroke`) that can be manipulated. Also try `visibility` & `opacity`.
² Uses SVGInjector © Waybury to convert to in-line.
... with the dark mode media query internal to the SVG.
As <img>
[³ Only works on Firefox & Opera browsers]
As <object>
As <embed>
As <iframe>