Карусель с “подглядывающими” карточками без JS!

В интерфейсах важно не просто показать контент, а подтолкнуть пользователя к взаимодействию. Один из приёмов — оставлять часть следующего элемента видимой.

Как работает:

• scroll-snap фиксирует карточки при прокрутке;

• ширина элемента меньше 100%, поэтому виден соседний блок;

• padding контейнера формирует зону “подглядывания”;

• :active добавляет быстрый отклик.

Такой паттерн активно используют в мобильных интерфейсах и лендингах, чтобы увеличить вовлечённость.

Code Ready | #фишка