Color4Bg: Background Generator 86

Color4Bg is a cool, easy-to-use abstract dynamic background generator that lets you export for free as an image, video, or JavaScript script. Color4bg.com allows you to effortlessly create dynamic, customizable colorful abstract backgrounds. These cool, beautiful backgrounds can make your work truly stand out. It's simple to use and comes with a wide range of templates. The generator supports exporting as PNG, video, or JavaScript.

Color4Bg offers multiple different style themes capable of generating dynamic, looping backgrounds. You can export them as images, videos, or directly import the background into your web project via a JavaScript script (JS file size <100k).

Color4Bg Features:

• Customizable Colors: You can specify an array of up to 6 colors to use for generating the background pattern.

• Dynamic Animation: The generated background can be set to loop, creating mesmerizing, fluid animations.

• Consistent Patterns: By providing a seed value, you can ensure that the same pattern is generated every time, making it easy to integrate into your web design.

• Easy Integration: Simply import the Color4Bg class and create an instance with your desired settings.

• Supports exporting as PNG or WebM video.

• Multi-language Support
  

How to Use Color4Bg?

Step 1: Choose a template and enter;

Step 2: Adjust the colors and customize the color theme;

Step 3: Click to download and export.

How to Use Color4Bg Code:

1. Import the AbstractShapeBg module:

import { AbstractShapeBg } from "../build/jsm/AbstractShapeBg.module.js"

2. Create an instance of AestheticFluidBg (or any other Bg type) with your desired settings:

let colorbg = new AestheticFluidBg({ dom: "box", colors: ["#D1ADFF", "#98D69B", "#FAE390", "#FFACD8", "#7DD5FF", "#D1ADFF"], seed: 1000, loop: true })

Parameter Description:

• dom: The DOM element to attach the background to.

• colors: An array containing up to 6 hexadecimal color values.

• seed: A numerical value used to generate consistent patterns.

• loop: A boolean value that determines whether the background should loop.

Color4Bg GitHub Source Code Download:https://github.com/winterx/color4bg.js