Note: 24

Here’s a fun SVG trick I just learned. If you set the fill or stroke properties to currentColor using CSS, your SVG will be the color of the text around it.

svg, svg path {
    fill: currentColor;
    stroke: currentColor;
}

This is great for auto-changing light and dark modes because it means you don’t need multiple images – the SVG will just change color appropriately.

Note, that this only works for inline SVGs, it doesn’t work with an <img> tag. Thanks to @freeplay for the reminder!

Change your computer’s Dark Mode setting, or use my /settings page, and watch the sun change colors!