Сайт целиком

Neon Bazaar: ночной рынок шаблонов

Плотный lookbook-лендинг для продажи маркетплейс-шаблонов: неоновые акценты на тёмном фоне, мерцающая типографика Bebas Neue, фотосетка с ценниками и фильтруемый каталог. Для создателей цифровых товаров под Wildberries и Ozon.

MarketplaceE-commerceLookbookDark ThemeNeonCatalogPricingHero
2 просмотров
0 использований
Палитра
ТипСайт целиком
Страниц в сайте1
ДоступОткрытый
Шаблон доступен к использованию

Нажмите «Использовать шаблон» — мы создадим проект у вас в аккаунте.

О шаблоне

Архетип lookbook-grid в максимально плотной, «восточно-ночной» интерпретации. Шаблон построен для продажи самих шаблонов — мета-уровень, где каталог товаров одновременно является демонстрацией стиля. Фон #0a0a0f — глубокий антрацит, а не чистый чёрный, что даёт мягкую глубину и позволяет неоновому розовому #ff2a6d выступать единственным источником «света» в интерфейсе.

Композиция и ритм. Hero-секция — это не классический headline + CTA, а живой витринный фасад: 8 квадратных карточек в плотной сетке 2×4 с 2px-просветами, создающими иллюзию прилавков ночного базара. Крупная типографика Bebas Neue размерами в 15vw ломает воздух — заголовок лежит поверх сетки, перекрывая края карточек, что создаёт намеренный хаос визуального слоя. Подзаголовок с неоновым мерцанием (neon-flicker, 2-секундный цикл) превращает текст в вывеску.

Каталог как experience. Фильтруемая сетка 4/5 (aspect-ratio) с насыщенными градиентными оверлеями transparent → #0a0a0f привязывает цену и название к нижнему краю, в то время как метки «-50%», «Бестселлер» и «Премиум» плавают в верхнем левом углу — точно как ценники на рыночных товарах. Каждая карточка содержит дополнительный слой: габариты макета, форматы файлов, превью-кнопка с hover-инверсией (#ff2a6d/10 → #ff2a6d).

Трёхшаговый блок выполнен в архитектуре «нумерованных станций» — огромные цифры 01-03 с 20% непрозрачностью служат фоновым ритмом, а иконки-«штампы» в квадратных контейнерах #ff2a6d/10 создают визуальный якорь. Горизонтальные границы #2a2a3a и backdrop-blur в шапке поддерживают единую плотность, не разрежая пространство.

Что докрутить под себя: логику фильтров каталога (текущий JS — client-side toggle display), подключить реальную корзину или модальные превью шаблонов, добавить микроанимацию появления карточек при скролле (IntersectionObserver + translateY), заменить Unsplash на собственные мокапы с наложенными UI-скриншотами, усилить accessibility через увеличение контрастности secondary-текста #6b6b80 → #8a8a9a.

Шаблон отличается от типичного AI-лендинга тем, что отказывается от центрированного белого пространства в пользу визуальной перегрузки, характерной для реальных коммерческих площадок — он продаёт не идею, а товарную плотность.

Страницы в сайте (1)
Как использовать шаблон
1
Нажмите «Использовать»Выберите название и URL — это займёт минуту.
2
Мы создадим проектУ вас в аккаунте появится сайт с готовым контентом.
3
Переделайте под себяAI-чат внутри редактора поможет адаптировать дизайн и тексты.