20

ffflux → Online SVG Fluid Gradient Background Generator

 2 years ago
source link: https://fffuel.co/ffflux/?ref=sidebar
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

ffflux
SVG generator for fluid gradient backgrounds

color 1
color 2
angle

blend mode ↷

overall opacity
frequency X
frequency Y
blur X
blur Y

Some sample gradient backgrounds generated using this tool ↷

example SVG gradient background 1example SVG gradient background 2example SVG gradient background 3example SVG gradient background 4example SVG gradient background 5example SVG gradient background 6example SVG gradient background 7example SVG gradient background 8example SVG gradient background 9example SVG gradient background 10example SVG gradient background 11example SVG gradient background 12

about ffflux

This SVG generator makes it easy to generate fluid and organic-feeling gradients. You can use the resulting graphics as backgrounds to elements on a page to give a colorful fluid look to page elements.

Behind the scenes, this generator makes use of SVG filters like feTurbulence, feGaussianBlur and feBlend to create the smooth and fluid effect on an SVG gradient.

Note that the resulting SVG files, while small in size, will often require a whole lot of graphic processing power to render, especially at large sizes and when the window is resized. If this becomes an issue in your particular use case, I recommend using a tool like Squoosh to rasterize the resulting SVG graphic to a modern optimized raster format like WebP or AVIF.

✨ I'm creating a collection of free HTML templates. Stay tuned and subscribe to stay in the loop:

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK