Логотип
Логотип Emailable доступен как в виде полного логотипа со словесным знаком Emailable, так и в виде иконки, каждая из которых имеет свои цветовые варианты и варианты использования. Пожалуйста, соблюдайте приведенные ниже правила использования.
Полный логотип
-
Главная
Окончательная версия логотипа Emailable. Используйте на светлых фонах.
Предпочтительный опыт работы:
-
-
-
-
Свет
Вариант основного логотипа с белым текстом. Используйте на темных фонах.
Предпочтительный опыт работы:
-
Черный
Используйте на светлых фонах в ситуациях, когда использование цвета ограничено. В остальных случаях используйте основную версию.
Предпочтительный опыт работы:
-
-
-
-
Белый
Используйте на темных фонах в ситуациях, когда использование цвета ограничено. В противном случае используйте светлую версию.
Предпочтительный опыт работы:
Значок логотипа
-
Главная
Окончательная версия иконки Emailable. Используйте на светлых фонах.
Предпочтительный опыт работы:
-
-
-
-
Черный
Используйте на светлых фонах в ситуациях, когда использование цвета ограничено. В остальных случаях используйте основную версию.
Предпочтительный опыт работы:
-
-
-
-
Белый
Используйте на темных фонах в ситуациях, когда использование цвета ограничено. В противном случае используйте основную версию.
Предпочтительный опыт работы:
Делайте:
-
Обеспечьте логотипу достаточное пространство между ним и другими элементами или краями документа (используйте букву "e" из логотипа в качестве безопасного расстояния)
-
Используйте правильный вариант в зависимости от фона (см. выше)
Не делайте этого:
-
Вносить изменения в логотип несанкционированным способом. Это включает, но не ограничивается: изменение цвета, непропорциональное преобразование, применение стилистических эффектов (например, свечение, тень, размытие, обводка и т. д.)
-
Размещайте логотип на фоне, на котором трудно разглядеть словесный знак или любой из цветов значка
Цвета
Официальная цветовая палитра Emailable и фоновые градиенты, используемые для дизайна/брендинга. Об использовании цветов в типографике см. раздел "Цвета шрифтов".
Палитра
Нажмите/щелкните образец, чтобы скопировать его HEX-код цвета.
-
Главная
-
Шифер
-
Красный
-
Оранжевый
-
Желтый
-
Зеленый
-
Циан
-
Голубой
-
Фуксия
Градиенты
Все градиенты являются радиальными градиентами и имеют круглую форму. Их начала расположены в 20 % от верхнего и правого краев фигур, содержащих их, и простираются по диагонали к левому нижнему углу (см. ниже).
-
Темный градиент
Основной градиент. Используется в качестве темного фона.
Остановка цвета:
-
Более темный градиент
Используется в качестве дополнительного темного фона для контраста с градиентом Dark.
Остановка цвета:
-
Фиолетовый градиент
Используется в качестве альтернативного или акцентного фона.
Остановка цвета:
Типография
Официальные рекомендации по стилизации шрифтов и типографики для Emailable, включая вес шрифтов и использование цветов в различных элементах интерфейса.
Шрифт
Inter
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
~`!@#$%^&*()_+-=,./<>?:;'"|\{}[]
-
Обычный 400
Вес по умолчанию. Используется для основного текста, описаний и т. д.
-
Средний 500
Используется для некоторых ссылок и меток.
-
Semibold 600
Используется для кнопок, значков, подзаголовков и некоторых фигур.
-
Смелый 700
Используется для заголовков, выделения и активных состояний.
Цвета шрифтов
-
Шифер 900
Цвет текста по умолчанию. Используется для заголовков, меток, выделяющегося текста и активных состояний. Только для светлых фонов.
-
Шифер 700
Используется для основного текста или текста, не имеющего большого значения. Только для светлых фонов.
-
Шифер 500
Используется для нейтральных значков.
-
Шифер 300
Используется для ввода текста-заполнителя или неактивных состояний.
-
Главная 500
Используется в качестве акцентного цвета для текстовых ссылок и некоторых подзаголовков.
-
Главная 200
Используется для основного текста или текста, не имеющего большого значения. Только для темных фонов.
-
Красный 500
Используется для сообщений об опасности/ошибках и значков.
-
Желтый 500
Используется для предупреждающих значков.
-
Зеленый 500
Используется для сообщений об успехах и значков.
-
Голубой 500
Используется для предупреждающих/информационных значков.
-
Белый
Используется для заголовков, ярлыков, выделяющегося текста и активных состояний. Только для темных фонов.