Kleuren met CSS-filter

Op de homepage staat de naam van de site in een kleur die moet passen bij de achtergrondfoto. Die kleur wordt met een CSS-filter ingesteld. Dat is handiger dan telkens een nieuwe afbeelding te maken in de gewenste kleur.

Om de waarden voor het filter te vinden gebruik ik deze filtergenerator.

Na een tijdje vond ik het toch niet handig om de kleur zo aan te passen. De huidige oplossing is de afbeelding op te bouwen met SVG. Dan kun je de kleur instellen met de CSS-property fill.

Die techniek werkt alleen als de XML van de SVG-afbeelding in de code van de pagina is opgenomen, niet met een extern bestand.