[fxtf-drafts] [filter-effects] tint() function (#533)

Secret-chest has just created a new issue for https://github.com/w3c/fxtf-drafts:

== [filter-effects] tint() function ==
[Link to the current spec.](https://www.w3.org/TR/filter-effects-1/)

Currently, webpage authors looking to change the image's colouring to a scale of a specific colour must combine the existing filters to approximate said colour or resort to overlays, JavaScript or other methods.

With this in mind, I propose a new filter function:
```
tint(map, amount)
```
where `map` is a `<color>` or `<gradient>` used to tint the image, and `amount` is a `<number>` or `<percentage>` used to blend the original with the filtered version, 1 being completely filtered, like it is with `sepia()`.

* If `map` is a `<color>`, then the image is converted to a greyscale and the dark end is mapped to `map`, while the light end is mapped to white, other levels being blended accordingly.
* If `map` is a gradient, then the image is converted to a greyscale and each level is mapped to a level of the gradient.

### Example
_Photo taken by me and available on https://commons.wikimedia.org/wiki/File:Muntii_Retezat_06.jpg under CC BY-SA. Processing done with GIMP._

First image is input, second is output, processed using this hypothetical value:
`filter: tint(linear-gradient(#0d7fb8, #ffe600), 100%)`

![original](https://github.com/w3c/csswg-drafts/assets/74449186/d0e32cbc-4a5c-437a-8ef8-03afb267ce73)
![gradient](https://github.com/w3c/csswg-drafts/assets/74449186/1d2c57af-f85c-45dc-b824-29ff234880fe)

Please view or discuss this issue at https://github.com/w3c/fxtf-drafts/issues/533 using your GitHub account


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

Received on Sunday, 8 October 2023 16:40:43 UTC