Re: [csswg-drafts] [css-images] @image rule for manipulating images (#6807)

> ## Using `@image` for manipulations?
> I think we could have our cake and eat it too, with an optional `src` descriptor. `image(--foo)` just uses what is specified in the `src` descriptor if one exists, or is IACVT if one does not exist, and `image(--foo, url("foo.png"))` overrides it. We could even specify it so that in the latter uses the image in `src` as a fallback.

I like @LeaVerou's idea of supporting both creating and manipulating images via `@image` with an optional `src` descriptor.

Could we also support a use case for inline-defined images for any images which are for single use and do not need to be defined under a variable name for reuse?  Hypothetically, this would be supported:

```postcss
@image --circle {
  src: url(/some-path/background.png),
  width: 190px;
  aspect-ratio: 1;
  clip-path: circle(closest-side);
}

.category-link {
  background-image: image(--circle, { width: 100px });
  background-repeat: no-repeat;
  background-position: center center;
}
```

Any braced object inside `image()` would be treated as an inline `@image` rule declaration.

-- 
GitHub Notification of comment by brandonmcconnell
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6807#issuecomment-2176807051 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 18 June 2024 19:26:22 UTC