|
Руст Кулматов
|
||||||||
|
В вебе этого можно добиться с помощью смешения радиальных градиентов: |
||||||||
<!-- index.html -->
<div class="gradient"></div>
/* style.css */
.gradient {
padding-bottom: 100%;
/* Добавим пару радиальных градиентов */
background:
radial-gradient(ellipse at 40% 40%, red, transparent),
radial-gradient(ellipse at 60% 60%, blue, transparent);
/* И смешаем их с помощью бленда мода */
background-blend-mode: screen;
}
|
Чтобы добиться более агрессивного смешения, можно поискать другой способ смешения цветов и добавить насыщенности: |
||||||||
<!-- index.html -->
<div class="gradient"></div>
/* style.css */
.gradient {
/* ... */
background-blend-mode: darken;
filter: saturate(250%);
}
|
А ещё можно замешать побольше градиентов, чтобы получить случайный паттерн: |
||||||||
/* style.css */
.gradient {
background:
radial-gradient(ellipse at center,
rgba(255, 255, 255, .2) 0%,
rgba(255, 255, 255, 0) 100%),
radial-gradient(ellipse at bottom left,
rgba(0, 200, 255, 1) 0%,
rgba(0, 200, 255, 0) 80%),
linear-gradient(135deg,
rgba(50, 50, 120, 0) 0%,
rgba(50, 50, 120, 0) 75%,
rgba(50, 50, 120, 1) 100%),
linear-gradient(75deg,
rgba(100, 100, 0, 1) 0%,
rgba(200, 100, 100, 1) 17%,
rgba(200, 150, 40, 1) 74%,
rgba(200, 100, 30, 1) 100%);
filter: saturate(150%);
}
|
P. S. Это был совет о
|