- From: Secret-chest via GitHub <sysbot+gh@w3.org>
- Date: Sun, 08 Oct 2023 16:40:41 +0000
- To: public-fxtf-archive@w3.org
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