Kleurverandering logo met scrollen met CSS
Met behulp van mix-blend-mode is het effect waarbij een vast of klevend element van kleur verandert op basis van de achtergrond waar het overheen staat, heel eenvoudig te doen!
Er zijn een paar belangrijke dingen om rekening mee te houden, maar het is niets moeilijks om mee om te gaan!
Meer over kleuren en kleurenschema’s
Ik ben eigenlijk al vanaf mijn kunstacademie-opleiding gefascineerd door kleuren en kleurgebruik. Ik heb een eigen kleurensysteem opgezet. Al met al heb ik hier honderden uren inzitten.
Veel bezoekers maken hier gebruik van voor hun websites. Wil je meer weten over deze kleuren? Kijk dan op:
GoldenRatioColors.com
Achtergrond verloop op scroll
Leer hoe je een achtergrondkleurverloop maakt met scroll:
www.w3schools.com/howto/howto_css_bg_gradient_scroll.asp
body {
height: 3000px;
background: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%);
}
See the Pen Change background colour with fade animation as you scroll by Dave Redfern (@daveredfern) on CodePen.