Телеграм, WhatsApp +380637610482
Валерий Данюк
Валерий ДанюкразработчикРазработка ИИ‑инструментов для бизнеса. Качественно. Недорого.Написать в Telegram
Slash — превью сайта в этом стиле

Slash

Полуночное хранилище с позолоченными линиями бухгалтерских книг

Slash работает в режиме полуночной галереи: почти чёрный холст, белый шрифт и единственный тёплый медный акцент, выполняющий функцию пунктуации. Заголовки отображаются шрифтом Ivy Presto, высококонтрастным дидоновым шрифтом с засечками, используемым в экстремальных размерах (до 88px) — это столкновение шрифтов с засечками и без засечек является визитной карточкой системы, придавая ей финансовую серьёзность без брокерской солидности традиционного банковского дела. Остальная часть пользовательского интерфейса намеренно сдержанна: тонкие границы, элементы управления в форме таблеток, компактный основной текст 16px и едва заметное возвышение, позволяющее шрифту «дышать». Единственный золотой градиент (линия графика, микроакценты) добавляет тепла в монохромную систему, вызывая тёплое свечение терминала Bloomberg, созданного для дизайнерской аудитории.

Контент с максимальной шириной 1216px, центрированный, с вертикальными промежутками 160px. Главный экран представляет собой темный холст во всю ширину с разделенной композицией: заголовок с засечками, выровненный по левому краю (ширина 64–88px), с полем для ввода адреса электронной почты ниже, и большая карточка пользовательского интерфейса продукта (скриншот панели управления) справа шириной 50%. В последующих разделах используется заголовок в одну колонку, центрированный (с засечками, ширина 44–64px), с подзаголовком шрифтом Inter, за которым следуют трехколоночные сетки карточек для описания функций/отзывов/блогов. Навигация представляет собой фиксированную верхнюю панель: логотип слева, центральное меню (Компания, Продукты, Решения, Клиенты, Цены, Часто задаваемые вопросы), выровненный по правому краю вход (незаметный) и начало работы (белый заполненный элемент). Нижний колонтитул представляет собой плотную пятиколоночную сетку ссылок с информацией о компании и юридическими положениями. На странице чередуются насыщенные контентом секции в виде сетки и полноэкранные статистические выноски — ритм задается большим количеством свободного пространства между полосами, а не чередованием цветов фона (вся страница представляет собой одно цельное полотно).

Фотографии выполнены в редакционном и натуралистическом стиле: теплые портретные снимки основателей и членов команды в их реальных рабочих условиях (офисы, гостиные, строительные площадки). Изображения заполняют рамки карточек от края до края без отступов. В нижней части карточек с отзывами для улучшения читаемости текста используется темный градиент. Эстетика — «LinkedIn встречается с редакционным журналом» — непринужденная, человечная, слегка приглушенная, никогда не отполированная стоковыми фотографиями. Миниатюры статей сочетают фотографии с иллюстрированными концепциями (человек, стоящий в лабиринте, камин с мешками с деньгами). Пользовательский интерфейс продукта отображается в темном режиме с полной непрозрачностью, паря над страницей на едва заметных темных поверхностях — это центральный элемент. Иконки монохромные с 1px штрихами в #2e3038 или #777a88, никогда не заполняются фирменным цветом.

Палитра

Нейтральные

  • Bone #e2e3e9 — Основной текст выделен крупным шрифтом, подробными метками данных, стандартный тон текста в большинстве элементов пользовательского интерфейса.
  • Obsidian #08080a — Холст страницы, фон нижнего колонтитула, самая темная поверхность — почти черный с едва заметным синим оттенком.
  • Onyx #040406 — Поверхность карточки, дополнительный фон — на один шаг глубже страницы для визуального эффекта.
  • Carbon #121317 — Приподнятые панели, ненавязчивая заливка пользовательского интерфейса — первый заметно более лёгкий шаг в развитии Surface Stack
  • Graphite #1c1d22 — Границы, разделители, контейнеры для значков, ползунки управления — тончайший цветовой оттенок, определяющий структуру.
  • Slate #2e3038 — Дополнительные границы, приглушенные линии иконок, едва заметные разделители между блоками контента.

Типографика

от 13 до 88px · 9 ступеней

  • Ivy Presto — замена: Playfair Display · начертания 400, 500 · Шрифт с засечками для заголовков и подзаголовков — используется исключительно для заголовков и названий разделов в 28px и выше. Высококонтрастные дидоновые штрихи с тонкими засечками создают ощущение редакционной роскоши; небольшое положительное межбуквенное расстояние 0.01em необычно и придает шрифту печатный, похожий на бухгалтерский, вид. Этот шрифт с засечками является основной визитной карточкой бренда — он отличает Slash от всех других SaaS-финтех-компаний, которые по умолчанию используют геометрический шрифт без засечек.
  • Inter — замена: Inter (self-hosted via Google Fonts) · начертания 300, 400, 500, 600, 700 · UI sans — основной текст, навигация, кнопки, метки, ссылки, поля форм и подзаголовок. На основном тексте используется шрифт 300 для ненавязчивого второстепенного текста; 500 преобладает для текста со средним акцентом и меток кнопок; 600 зарезервировано для меток категорий, написанных малыми прописными буквами. Отрицательный межбуквенный интервал уменьшается с 2-го (-3-го) и уменьшается по мере уменьшения размера, что характерно для оптического масштабирования шрифта Inter.

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

НазначениеЗначение
Плотностьпросторная
Базовый шаг8px
Радиус кнопок9999px
Радиус карточек10px
Тенинет — границы вместо теней
Между секциями160px
Ширина страницы1216px

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

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

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

  • Modal — Фосфорный терминал в затемненной серверной комнате — единственным источником света является ярко-зеленый цвет
  • AgentQL — Северное сияние над ночным терминалом
  • GitHub — Космическая командная панель с биолюминесцентными контрольными точками — темное, атмосферное рабочее простра…
  • Doppler — Фиолетовое освещение хранилища в полночь. Почти чёрное полотно светится единственным лавандовым сигналом и з…
  • Basedash — Полуночный терминал данных с матовым шрифтом. Темная обсерватория, где метрики светятся фиолетовым и зеленым…
  • Superwhisper — Северное сияние растворяется над полуночным стеклом
  • Better Stack — Полуночная консоль SRE
  • Langbase — Полуночное северное сияние консоль
  • Astro — Центр управления полетами в дальнем космосе с одиночным фиолетовым свечением туманности
  • Wayfinder — Черный киноэкран с едва слышным названием, парящим над живой иллюстрацией. Интерфейс представляет собой регу…
  • HashiCorp — Диспетчерская в полночь с фиолетовым неоном — темная техническая поверхность, где светящийся шестиугольный к…
  • Umbrel — Уютный очаг в ночной серверной — темное помещение, где единственный персиковый отблеск указывает на то, что …