← Chrome 150 reference

v150 · covered on mdn

CSS image(<color>) function

A CSS function that generates a solid-colour image from any <color> value — the direct and self-documenting replacement for the linear-gradient(transparent) workaround. Chrome 150 ships the colour-only subset of the full image() function.

this API is documented on MDN

image() CSS function — CSS — MDN Web Docs

gendn doesn't duplicate APIs that MDN already covers. MDN's page for image() documents the full function syntax including the solid-colour form Chrome 150 ships. Browser-compat data on the MDN page will reflect Chrome 150 support once it is updated.

what Chrome 150 ships

Chrome 150 implements the <color> argument form only:

/* Any <color> value is valid */
background-image: image(transparent);
background-image: image(red);
background-image: image(oklch(0.5 0.2 30));
background-image: image(light-dark(white, black));

The resulting image has no intrinsic dimensions, so it paints the element's entire background area in the given colour. Unlike linear-gradient(transparent), the intent is explicit and the syntax is composable with light-dark() and other colour functions.

references