/01SVG
Живая волна
Курсор тянет контрольные точки — настоящая интерполяция Безье.
webgl · three.js · css · vanilla
ВАУ
Лаборатория, где статика встречается с шейдерами,
а CSS — с физикой. Заходи, потыкай, поломай.
В цифрах
Самопрезентация в шести числах. Счётчики тикают при первом появлении в зоне видимости.
0
экспериментов
в каждой карточке своя физика и реакция
0
частиц в фоне
WebGL, additive blending, vertex colors
0KB
исходников
HTML + CSS + JS, ноль сборщиков
0%
браузерной магии
только стандартные API, никаких хаков
Эксперименты
Шесть карточек — шесть техник. Курсор, мышь, клавиатура — каждая реагирует по-своему.
/02canvas
Частицы-магнит
Наведи курсор — частицы притянет к центру карточки.
/03js
Шифр-эффект
Символы меняются при наведении и фиксируются на правильном тексте.
ШИФРОВАНИЕ ВКЛ
/04css vars
Колориметр
Кликни на цвет — он станет акцентом всего сайта.
/05css3d
Голографический куб
perspective, preserve-3d, шесть граней — чистый CSS.
WEBGL
SHADERS
PHYSICS
CSS
VANILLA
FUN
/06easter egg
Пасхалка
Классика: ↑↑↓↓←→←→BA. Набери — увидишь.
ожидание…
Лог сборки
Этот сайт — ноль зависимостей, кроме three для фона. Дальше — чистый браузер.