Re: [csswg-drafts] [css-backgrounds] Add `background-opacity` as an alternative to Relative Color (Color Module Level 5) (#8465)

Another way to achieve this would be via image manipulation as discussed in #6807.
The syntax and names are still in discussion, though applying the proposed solutions to the given example, it might be expressed like this:

```
@image-manipulation --o {
  opacity: 0.5;
}

:root {
  --c-primary: #e2273c;
}

.regular-background {
  background: manipulate-image(color(var(--c-primary)), --o);
}
```

or like this:

```js
:root {
  --c-primary: #e2273c;
}

.regular-background {
  background: image(color(var(--c-primary)), opacity(0.5));
}
```

Two big benefits of that approach:
1. It can be applied everywhere `<image>` values are allowed, i.e. `background-image`, `border-image-source`, `mask-image`, `list-style-image`, etc.
2. It allows a much greater variaty of image manipulations than just opacity.

Having said all that, this issue is actually a duplicate of #4996. So I close it in favor of the other one.

Sebastian

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


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

Received on Friday, 17 February 2023 23:05:07 UTC