Color4Bg: Генератор фонов 85

Color4Bg — удобный генератор крутых абстрактных динамических фонов с бесплатным экспортом изображений, видео или JS-скриптов. Color4bg.com позволяет вам легко создавать динамичные, настраиваемые по цвету абстрактные фоны. Крутой и красивый фон способен выделить ваши работы среди остальных. Прост в использовании, множество шаблонов. Генератор поддерживает экспорт в формат PNG, видео или JavaScript.

Color4Bg предлагает множество различных стилевых тем, способных генерировать динамические, зацикленные фоны, которые можно экспортировать в виде изображений, видео или напрямую подключать к фону вашего веб-проекта с помощью JS-скрипта (размер JS-файла <100 КБ).

Функциональные возможности Color4Bg:

• Настраиваемые цвета: вы можете задать массив из не более чем 6 цветов для генерации фонового узора.

• Динамическая анимация: сгенерированный фон можно настроить на зацикливание, создавая завораживающую плавную анимацию.

• Стабильные шаблоны: задав значение seed, вы можете быть уверены, что каждый раз будет генерироваться один и тот же шаблон, что упрощает интеграцию в дизайн вашего веб-сайта.

• Простая интеграция: достаточно импортировать класс Color4Bg и создать экземпляр с нужными вам настройками.

• Поддержка экспорта в формат PNG или Webm-видео.

• Мультиязычная поддержка
  

Как пользоваться color4bg?

Шаг 1: выберите шаблон и перейдите к нему;

Шаг 2: настройте цвета и задайте собственную цветовую тему;

Шаг 3: нажмите, чтобы скачать и экспортировать

Инструкция по использованию кода Color4Bg:

1. Импортируйте модуль AbstractShapeBg:

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

2. Создайте экземпляр AestheticFluidBg (или любого другого типа Bg) с нужными вам настройками:

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

Описание параметров:

• dom: DOM-элемент, к которому будет привязан фон.

• colors: массив, содержащий до 6 шестнадцатеричных значений цветов.

• seed: числовое значение, используемое для генерации стабильного шаблона.

• loop: логическое значение, определяющее, должен ли фон воспроизводиться циклически.

Скачать исходный код Color4Bg с Github:https://github.com/winterx/color4bg.js