Foodnoms

Солнечный фруктовый рынок на белом фарфоре — теплые оранжевые, свежие зеленые и объемные округлые формы

Foodnoms представляет собой светлый маркетинговый язык для отслеживания питания: чистый белый холст, увеличенные макеты телефонов в качестве визуального якоря и игривый цветовой словарь, где цвета кодируют питательные вещества и прогресс. Двухцветная схема заголовков (один цвет для ключевого слова, темно-графитовый для остального) позволяет быстро оценить ценностное предложение. Система опирается на единый пользовательский дисплей (Aquawax Pro) с отчетливо закругленными геометрическими чертами, которые смягчают насыщенные данными экраны приложений. Большинство поверхностей плоские и без теней; равномерный радиус скругления углов придает кнопкам, карточкам и меткам дружелюбное, мягкое ощущение, благодаря чему отслеживание здоровья воспринимается скорее как доступное, чем как клиническое занятие.

Страница имеет одноколоночный, центрированный макет максимальной ширины (~1200px) с щедрым вертикальным ритмом. Заголовок представляет собой тонкую верхнюю панель с логотипом слева, навигацией по центру и заполненной оранжевой кнопкой действия справа. Геройская часть представляет собой центрированный стек: двухцветный заголовок, однострочный подзаголовок, значок App Store, а затем ряд из 3–5 макетов телефонов, расположенных веером по всей ширине. Под героем находится центрированная секция с логотипом для прессы «Как рекомендовано» в сетке 2×3. Разделы с функциями следуют по повторяющемуся шаблону: двухколоночный текст + макет телефона, чередующиеся стороны, с акцентными заголовками разделов оранжевого/зеленого цвета. Последний элемент перед нижним колонтитулом — это карточка CTA для загрузки во всю ширину. Промежутки между разделами большие (96px), создавая ощущение простора, как в галерее. Навигация представляет собой минималистичную верхнюю панель — без боковой панели и мега-меню.

Визуальный язык приложения доминируют высококачественные макеты рамок iPhone, демонстрирующие работающий интерфейс приложения — это главные элементы, а не стоковые фотографии. Макеты отображаются с почти полной прозрачностью, веером с небольшим наложением и плавным поворотом, располагаясь непосредственно на белом фоне. Внутри макетов визуальную составляющую обеспечивает собственный интерфейс приложения: данные о пищевой ценности, фотографии продуктов, макрокольца и красочные теги категорий. Единственный фотографический контент — это предоставленные пользователями изображения продуктов питания, видимые на экране камеры приложения «Сканируйте свою еду». Никаких фотографий в стиле лайфстайл, никаких абстрактных иллюстраций, никакой декоративной графики. Фирменный стиль полностью определяется разработанным шрифтом, цветовой системой оранжевый/зеленый/темный и собственным интерфейсом приложения.

Чистый SaaS Игривый Высокий контраст

https://foodnoms.com

Палитра

Бренд

Ember Orange #ff5406 — Оранжевый цвет используется в качестве вспомогательного акцента для декоративных деталей и акцентирования внимания на нечастых сигналах. Не следует выделять его как основной цвет призыва к действию.

Нейтральные

Graphite #2f2f2f — Основной текст, темные кнопки (значок App Store) и обводка иконок. Преобладающий не белый цвет в заголовках и основном тексте.
Verdant Green #00b33f — Зеленый цвет служит дополнительным акцентом для декоративных деталей и подчеркивания низких частот.
Signal Red-Orange #ff3400 — Вторичный теплый акцент, заметный в элементах пользовательского интерфейса экрана приложения и в сопутствующих моментах, связанных с брендом. На один тон теплее, чем Ember Orange, для акцентирования внимания на выбранных или активных состояниях приложения.
Sky Blue #00a9dd — Приятный контраст для внутренних категорий данных приложения (углеводы/белки/другие группы питательных веществ). Уравновешивает теплую, доминирующую цветовую палитру в макетах телефонов.
Mist Blue #72a2c5 — Приглушенный холодный акцент — смягчает синий цвет Sky для дополнительных меток данных и фона диаграмм внутри приложения.
Sunset Orange #ff6d00 — Теплый акцент для второстепенных заголовков и выделенного текста на страницах маркетинговых материалов.

Типографика

от 12 до 60px · 7 ступеней

Aquawax Pro Medium — замена: Inter · начертания 500 · Aquawax Pro Medium — обнаружен в извлеченных данных, но не описан ИИ.
Aquawax Pro — замена: Nunito Sans · начертания 700, 500, 600 · Основной фирменный шрифт, используемый во всех контекстах: заголовках и основном тексте. Этот специально разработанный шрифт отличается широкой высотой строчных букв, округлыми геометрическими формами и удобными пропорциями. Жирный (700) используется для заголовков и разделов — это типографические ориентиры системы. Полужирный (600) используется для подзаголовков и надписей кнопок размером 14–1,8 мм. Средний (500) используется для основного текста размером 17–1,8 мм с достаточной межстрочной разметкой 1,6–1,8 мм для комфортного чтения.
System sans-serif — замена: Inter · начертания 400, 700 · Для очень мелких текстовых и иконочных надписей в пользовательском интерфейсе используется резервный вариант. Aquawax Pro не используется в микроразмерах; системный шрифт обрабатывает их, чтобы снизить вес отрисовки.

Интервалы и форма

Назначение	Значение
Плотность	просторная
Базовый шаг	20px
Радиус кнопок	26px
Радиус карточек	26px
Тени	нет — границы вместо теней
Между секциями	96px
Ширина страницы	1200px

ИИ соберёт ваш сайт в стиле Foodnoms и наполнит его

Наполнит товарами и постами по ссылке — Instagram, TikTok, Facebook.
Перенесёт контент со старого сайта — достаточно указать адрес.
Современный дизайн на лучшем движке: React (Next.js) с серверным рендерингом и SEO-оптимизацией из коробки.
Полная автоматическая SEO-оптимизация под поисковую выдачу и рекомендации нейросетей.

Создать сайт в этом стиле

Foodnoms

Палитра

Типографика

Интервалы и форма

ИИ соберёт ваш сайт в стиле Foodnoms и наполнит его

Похожие стили