VisiQ Design System
Единый стиль интерфейса VisiQ
Цвета
Базовая палитра Night Pulse. Используется и в Android-приложении, и на сайте.
Кнопки
Основная (градиент), её состояния, вторичная и кнопка-ссылка.
Основная
Hover
Active
Disabled
Вторичная
Кнопка-ссылка
Поля ввода
Название поля — внутри окантовки (floating label). Под активным полем показывается счётчик длины n/max. Лимиты: VisiQ ID 20, Имя 40, Email 254, Пароль 64. Ограничение символов: VisiQ ID — латиница/цифры/«_»; логин/пароль/email — без кириллицы; Имя — без ограничений.
Обычное
Логин или email
Фокус / active
Логин или email
Ошибка
Пароль
Неверный логин или пароль
Пароль (глаз)
Пароль
Ссылки
Акцентная ссылка и ссылки авторизации.
Иконки
Vector drawable / SVG в едином стиле. Приглушённый цвет по умолчанию, акцент — фиолетовый.
Человек
Замок
Глаз
Глаз закрыт
Mail
Check
Info
Уведомления
Success-блок (регистрация) и info-блок (восстановление пароля).
Аккаунт успешно создан!
Добро пожаловать в VisiQ.
На указанный email будет отправлено письмо с инструкциями по восстановлению пароля.
Auth-компоненты
Мини-примеры Login / Register / Forgot Password — в одном стиле с компонентами APK. Только дизайн.
Вход
Добро пожаловать!
Логин или email
Пароль
Регистрация
Создайте новый аккаунт VisiQ
VisiQ ID
Email
Пароль
Аккаунт успешно создан!
Добро пожаловать в VisiQ.
Забыли пароль?
Не переживайте, мы поможем.
Email
На указанный email будет отправлено письмо с инструкциями по восстановлению пароля.
VisiQ Design System · visiq.ru