invalid-css-input

This rule reports an argument of style.css() that the compiler cannot turn into CSS at build time, such as a number, a runtime condition, a ref, or a stored style() result. The argument adds nothing to the string.

Reported

const widthInPixels = 42;
style.css(widthInPixels, { selector: ":host" });invalid-css-input: style.css() accepts only static utility strings, arrays, and variant groups: the input is not static

Fixed

style.css("w-[42px]", { selector: ":host" });

How to fix

• Write the style as utilities that are known at build time.
• For a value that changes at runtime, set a custom property on the element with JavaScript, and read it in a utility such as w-(--width).

style.css() lists the accepted inputs.

Rule settings