Перейти к основному содержанию
Footer

Footer Design: галерея качественных референсов для футеров сайтов

Веб-дизайнДизайн футераДизайн-вдохновениеUI-референсы

Библиотека идей для футеров сайтов с фильтрами по типу и стилю — от типографичных и иллюстративных до сеточных, карточных и анимированных; у каждого примера есть отметка редакции и ссылка на оригинал.

★ 9 Последнее обновление: 2026-11-08 footer.design
Перейти на сайт

Подробное описание

Галерея, которая собирает только футеры

Футер обычно прорабатывают последним, а разваливается он первым: куча ссылок в одном блоке и копирайт на скорую руку. Footer Design собирает чужие удачные футеры в одном месте, чтобы вам не приходилось листать чужие сайты до самого низа в поисках нижней части.

Сайт называет себя «единственной галереей футеров на планете»: примеры разложены по стилям с постраничным просмотром, сейчас в списке 65 страниц. У каждой записи есть миниатюра-превью и ссылка на оригинал — можно перейти и посмотреть, как сделаны шрифт, отступы и интерактив.

По каким параметрам можно фильтровать

Метки ставятся по типу и стилю — примерно на языке, которым заказчик описывает задачу:

  • Typographic, Large Type, Bold — футер, построенный на крупной типографике
  • Small Type — мелкий плотный текст с большим объёмом информации
  • Illustrative — выразительный футер с иллюстрацией
  • Grid — сеточная раскладка
  • Flat — плоский, без декора
  • Animated — с анимацией
  • Cards — разбивка на карточки
  • Bright, Dark — светлое и тёмное направления
  • Info, Newsletter — информационный и подписной типы

Отдельно есть раздел Editor's Choice: если начать с избранного, можно сэкономить немало времени.

Для каких задач подходит

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

Проект делает студия NOOON, также открыт приём заявок на добавление работ.

Navbar Gallery: большая коллекция идей для навигации на сайтах

Галерея, которая собирает только удачные примеры навигации на сайтах — с фильтрами по статичным меню, выпадающим спискам, Mega Menu, боковым панелям и поиску; у каждого примера есть ссылка на живой сайт.

Веб-дизайнНавигацияДизайн-вдохновение

Variant: одна фраза на входе — и бесконечные варианты дизайна на скролле

Введите идею приложения или сайта и скролльте бесконечную ленту дизайн-направлений. Никакого холста и бесконечного переписывания промптов: остановитесь на том варианте, который зацепил. Экспорт в HTML и React.

ИИ-дизайнгенерация интерфейсовдизайн-вдохновение

Scrolltide: кинематографичные шаблоны сайтов со скролл-анимацией и библиотека дизайн-промптов

Библиотека промптов для шаблонов сайтов со скролл-анимацией, компонентов и шейдеров. Копируете промпт, вставляете в ИИ — и получаете страницу, которая действительно двигается, а не выдаёт себя за работу нейросети с первого экрана.

Веб-дизайнПромптыСкролл-анимация

shadcn/ui: Создавайте свою библиотеку компонентов

Хорошо спроектированные компоненты, которые вы можете скопировать и вставить в свои приложения. Доступные. Настраиваемые. Open Source.

develop

Header Name: бесплатный генератор баннеров

Создавайте бесплатные баннеры для X, LinkedIn, YouTube и GitHub: 48 шаблонов, локальное редактирование, экспорт PNG/SVG и общий ZIP.

freeГенератор баннеровЛичный бренд

Anime.js: Легковесная JavaScript библиотека для анимации

Anime.js — это эффективная JavaScript библиотека для анимации, поддерживающая анимацию HTML, SVG, CSS и других элементов, идеально подходящая для фронтенд-разработчиков и дизайнеров для быстрого создания веб-анимации, улучшающей пользовательский опыт.

фронтенд разработкавеб-дизайн