HTML:

CSS:

JS:

  • Подключаем скрипт: bg-62.js

Автор DeepSeek

Настроики под другие цвета:

Меняем HSL параметры в шейдере:

Находим эту строку:

vec3 hsl = vec3(208.0 / 360.0, 0.56, lightness);

Hue (оттенок 0-360°):

208.0 - синий

0.0 или 360.0 - красный

120.0 - зеленый

240.0 - синий (другой)

300.0 - фиолетовый

Saturation (насыщенность 0-1):

0.56 - 56%

0.0 - серый (без цвета)

1.0 - максимальная насыщенность

Lightness диапазон (яркость):

Находим:

float lightness = 0.4 + 0.3 * n;

0.3 - минимальная яркость (30%)

0.4 - размах (40%)

Итоговый диапазон: 0.3 до 0.7 (30-70%)

Быстрые пресеты:

Красные тучки:

vec3 hsl = vec3(0.0, 0.7, lightness); // hsl(0, 70%, X)

Зеленые тучки:

vec3 hsl = vec3(120.0 / 360.0, 0.6, lightness); // hsl(120, 60%, X)

Фиолетовые тучки:

vec3 hsl = vec3(280.0 / 360.0, 0.5, lightness); // hsl(280, 50%, X)

Серые тучки (как раньше):

vec3 hsl = vec3(0.0, 0.0, lightness); // hsl(0, 0%, X)

Диапазон яркости:

Темные (20-40%):

float lightness = 0.2 + 0.2 * n;

Светлые (70-90%):

float lightness = 0.7 + 0.2 * n;

Очень контрастные (10-80%):

float lightness = 0.1 + 0.7 * n;

Смотрите также:

Добавить комментарий:

Ваш комментарий отправлен!