Reverse Text Color Based on Background Color Automatically in CSS

---

Over the weekend I noticed an interesting design for a progress meter in a videogame. The % complete was listed in text in the middle of the bar and didn't move. But that text was the same color as the background of the bar that was filling up from left to right. It seemed like the background was going to make the text invisible once they overlapped, but instead, the text color reversed to be white instead anywhere it overlapped …

---

Reverse Text Color Based on Background Color Automatically in CSS is a post from CSS-Tricks

Thanks to: CSS-Tricks Permanent link