If/Else in CSS

Today I got to try the experimental if/else syntax in CSS: /* Component.module.css */ img { transform: if(style(--isZoomed: true): scale(2) ; else: scale(1)); } I used it to pass a variable from React state to the stylesheet: // Component.tsx <img style={{'--isZoomed': isZoomed ? 'true' : 'false'}} /> I think conditional classes would be my preference for managing this for real, but this is an alternative. if() CSS Function — MDN