Nighttime Flows Animated SVG Background
What is Nighttime Flows Animated SVG Background
This is an animated SVG which is generated by this other pen here that generates a random SVG, when clicked it mentions to check the menu for the SVG but i cant see a menu there.
What can i use this for?
This is an SVG so can be used as a background or image header, kinda cool animation included here.
Should I use Nighttime Flows Animated SVG Background?
You could use this to animate your background or hero elements, with something that does not stand out too much, maybe add some white hover over text to this.
Conclusion
Nighttime Flows Animated SVG Background is a nice example of an animated SVG that could be used as a background on your next project. It kind of reminds me a bit of the waves at a beach.
Original Codepen Source
Thanks to the author leimapapa, this code comes from the Nighttime Flows pen on Codepen.
Nighttime Flows Animated SVG Background Demo
View Demo Full Screen View Demo New Tab
Nighttime Flows Animated SVG Background Code
HTML
<svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%">
<filter id="filter-ben36zxm">
<feTurbulence baseFrequency="0.0003" numOctaves="10" seed="6"></feTurbulence>
<feColorMatrix class="anim" type="hueRotate" values="0">
<animate attributeName="values" from="0" to="360" dur="20s" repeatCount="indefinite"></animate>
</feColorMatrix>
<feColorMatrix values="-2 -2.2 -1.6 3.5 -1.4 1.4 3.8 -5 -2.5 -2.7 3.9 -1.4 2.6 -2.9 -3.4 -2.4 -4.3 0.6 2.4 1.3"></feColorMatrix>
<feDiffuseLighting lighting-color="rgb(55,121,208)" surfaceScale="1">
<feDistantLight azimuth="90" elevation="178"></feDistantLight>
</feDiffuseLighting>
</filter>
<rect width="100%" height="100%" filter="url(#filter-ben36zxm)"></rect>
</svg>External Link for Nighttime Flows Animated SVG Background
Related Tags
Add Comment
Other Items in Animations
Related Search Terms
Other Categories in Code
Random Quote
