Ember - це преміум-шаблон сайту, готовий до запуску, для сучасного ресторану з дров'яною кухнею, сезонного бістро чи гриль-залу: закладу, який перемагає за столик ще до приходу гостя. Теплий кремовий колір, чорнило кольору еспресо та єдиний теракотовий акцент створюють атмосферу при свічках і гастрономічного журналу, завдяки якій ваші страви стають найвиразнішим елементом сторінки.

Він побудований на статичному HTML + Tailwind CSS. Без React, без етапу збирання: скомпільований CSS іде в комплекті, тож ви відкриваєте index.html і вже в мережі на будь-якому статичному хостингу.

ЩО ВСЕРЕДИНІ (11 секцій)

• Закріплена навігація + доступне мобільне меню

• Герой-блок із круглим обкладинковим фото страви та рукописною запискою шефа

• Смуга про нашу історію / філософію кухні на вогні

• Фірмові страви (фотокартки з ціною на пунктирній лінії)

• Повне меню: категорії з пунктирними лініями як у друкованому меню (назва ……… ціна)

• Редакційна галерея (асиметрична мозаїка, а не рівномірна сітка)

• Знайомство з шефом з анімованою статистикою зі зростанням чисел

• Відгуки та преса із зірковими оцінками

• Форма бронювання (чесна, без темних патернів)

• Години роботи та розташування (години оформлено тим самим мотивом пунктирних ліній) + заглушка карти на CSS

• Футер із підпискою на розсилку

ЧОМУ ВІН ІНШИЙ

• Справжній фірмовий стиль, а не типовий набір: пунктирна лінія друкованого меню повторюється в стравах, меню та годинах роботи; круглий герой-блок обрамляє їжу, як обкладинку; рукописний шрифт Caveat передає голос шефа.

• Змінюйте вигляд в одному місці: кожен колір і шрифт - це токен; змініть теракотовий, і весь сайт піде за ним.

• Шрифти на власному хостингу (Cormorant Garamond · Manrope · Caveat, woff2): без Google CDN, без зсувів макета.

• Стійкий до проблем із зображеннями: кожне фото має теплу резервну заміну на CSS, тож сторінка ніколи не виглядає зламаною.

• Контраст WCAG AA, семантичний HTML, зручність для клавіатури, підтримка prefers-reduced-motion.

• Lighthouse: продуктивність 95 · доступність 100 · найкращі практики 100 · SEO 100.

• Без темних патернів: ніяких фальшивих таймерів і штучного дефіциту.

ЩО ВИ ОТРИМАЄТЕ

index.html · скомпільований + вихідний Tailwind CSS · кілька КБ чистого JS · шрифти на власному хостингу · фавікон + OG-зображення · 12 демонстраційних фото · документація · журнал змін · примітки щодо ліцензії.

Живе демо (безкоштовна версія Lite): https://mcmxcixx.github.io/ember/