Set text color to white on red background and black text color on white background with CSS

Question

I need a CSS styling that makes the text color white when the background is red and a black text color when the background is white.

My red background has the following color: #d6002e

I added this CSS to my text:

mix-blend-mode: difference;
color: #29FBFF;  // Inverted color of my red

Now it looks like this :

My text gets the inverted color of the background, which is not exactly what I want.

user_17077785 · Answer

I feel this should solve the problem

.my-red-bg {
    background: #d6002e;
    color: white
  }


.my-black-bg {
    background: black;
    color: white
 }