инструмент полуночной точности

Дизайн-система Linear — это ночной командный центр, построенный на почти черных поверхностях (#08090a) с белоснежным шрифтом и одним ярким акцентом цвета лайма (#e4f222), который функционирует как функциональный фонарик — маленький, высококонтрастный и используемый экономно для обозначения действий. Интерфейс рассматривает темноту как основу, а не как тему: текст — четкий белый с плотным межбуквенным расстоянием (-0.022em), толщина шрифта находится в низком диапазоне 400–510, а не жирный, а границы — тончайшие (0.5px), чтобы позволить геометрии выполнять работу, которую обычно выполняют тени. Компоненты ощущаются как точно обработанные — радиусы 6px и 12px, компактные отступы 8–12px и почти полное отсутствие декоративных элементов — позволяя пользовательскому интерфейсу продукта (карточки задач, канбан-доски, панели агентов ИИ) быть единственной визуальной текстурой в остальном спокойной системе.

Макет имеет максимальную ширину, ограниченную примерно 1200px, центрирован, с темным фоном, простирающимся до краев области просмотра. Главный элемент — это крупный заголовок, выровненный по левому краю (64–72px), в паре с призывом к действию (CTA), выровненным по правому краю, за которым следует большой скриншот продукта, немного выходящий за пределы максимальной ширины. Ритм разделов чередуется между двухколоночными композициями с текстом слева и изображением справа и полосами демонстрации продуктов во всю ширину, разделенными вертикальными промежутками 96px. Полоса с логотипом клиента представляет собой один горизонтальный ряд. На странице никогда не используются трехколоночные сетки карточек или мозаичные структуры — плотность информации остается низкой, большинство разделов используют достаточное пустое пространство и один фокусный элемент на экране. Навигация представляет собой фиксированную верхнюю панель с логотипом, выровненным по левому краю, и ссылками, выровненными по правому краю, без боковой панели и мега-меню.

Визуальный язык Linear основан на использовании скриншотов продукта: иллюстрации в начале и в разделах представляют собой реальные изображения пользовательского интерфейса приложения Linear, снятые с максимальной детализацией — карточки задач, канбан-доски, панели агентов ИИ, палитры команд — помещенные в рамки с тонкими рамками. Никаких стоковых фотографий, никаких изображений в стиле лайфстайл, никаких абстрактных иллюстраций. Логотипы отображаются в виде полосы для клиентов нейтрального серого цвета (#8a8f98) одинакового размера. Иконки представляют собой минималистичные линейные SVG-изображения в одноцветной серой гамме. Скриншот в начале страницы плавает на едва заметном линейном градиенте (от темного к светлому), который создает атмосферную глубину без использования реальных пейзажей. Каждый визуальный элемент является функциональным элементом самого продукта.