Overprint — шаблон сайта студии Letterpress & Risograph (HTML + Tailwind)

Overprint — это премиальный одностраничный HTML-шаблон для независимых студий letterpress & risograph, канцелярских магазинов и печатников, которые хотят сайт, выглядящий так, будто его сняли с пресса — а не собрали из конструктора.

Вся айдентика — двухцветная riso-работа, пойманная в середине тиража: каждый заголовок и ключевая форма печатаются дважды — флуоресцентно-розовой и riso-синей краской, слегка не в регистре — и там, где два слоя пересекаются, они умножаются в реальный третий цвет, оверпринт-фиолетовый. Наведите на заголовок — пластины «встают» в регистр, как будто оператор пресса чуть подвёл пластину. Сделано с mix-blend-mode, а не с фейковой тенью — фиолетовый является физикой, а не градиентом.

ЧТО ВНУТРИ (10 секций)

• Мастхед с метками обреза и неверно (не по полю) свёрстанным заголовком + единый тиснёный (debossed) CTA «Request a proof»

• Выверенный по ширине, сверстанный «вручную» эссе формата «proof sheet» на видимой базовой сетке

• Возможности в виде табличного прайс-листа печати (а не иконки-карточки)

• Галерея работ в дуотоне на весь экран (full-bleed) с номерами изданий

• Процесс печати: Plate → Ink → Register → Pull → Cure

• Тактильная библиотека образцов бумаги и чернил с letterpress deboss

• Полоса с портретом студии, повернутая на угол

• Форма заявки на комиссию «request a proof»

• Магазин изданий с пронумерованными отпечатками в форме штампа

• Футер-колофон с калибровочной полосой цвета принтера (printer's color-bar calibration strip)

ПОЧЕМУ ЭТО ОТЛИЧАЕТСЯ

• Подпись, которую вы ещё не видели в шаблонах: физическое misregistration чернил + «схлопывание в регистр» (register-snap) при наведении

• Постоянная (always-on) print furniture — видимая сетка, угловые метки обреза, базовая разбивка линиями, «бегущий» фолио в полях

• Статический HTML + Tailwind CSS — без фреймворка, без сборки: просто установите на любой хост

• Токен-управляемый, полностью адаптивный, WCAG AA для body и UI; зерно бумаги + halftone сделаны с помощью реального SVG

• Шрифты self-hosted (Fraunces + Spectral + IBM Plex Mono), Lighthouse 96 / 96 / 100 / 100

ЧТО ВЫ ПОЛУЧАЕТЕ

index.html · скомпилированный + исходный Tailwind CSS · небольшой vanilla JS · self-hosted fonts · документация · changelog · заметки по лицензии.

Идеально для студий letterpress/riso, канцелярских магазинов, печатников, создателей зинов, независимых издателей и керамистов.

Живой демо-пример (бесплатная Lite-версия): https://mcmxcixx.github.io/overprint/