Підтримка Хмара Застосунок |

Бренд

Брендбук Lailio: логотип, кольори, типографіка, графічна мова та вебстандарти в одному місці.

Брендбук

Бренд Lailio в одному місці.

Живий довідник для всіх, хто працює від імені Lailio: логотип, кольори, типографіка, графічна мова, тон комунікації та вебстандарти. Він ґрунтується на офіційному посібнику зі стилю та доповнений правилами, на яких побудовано цей вебсайт.

Завантажити посібник зі стилю (PDF) Завантажити пакет логотипів (ZIP)

02 · Правила

Охоронне поле та розмір

Охоронне поле

Охоронне поле

Логотип побудовано на основі модуля X. Його висота становить 4X, ширина 10X. Завжди залишайте охоронне поле щонайменше X з усіх боків: у нього не можуть потрапляти текст, зображення чи інші елементи.

Мінімальний розмір

Мінімальний розмір

Щоб логотип залишався читабельним, ніколи не використовуйте його меншим за рекомендований розмір.

Горизонтальний
85 px · 30 mm
Вертикальний
57 px · 20 mm

Фони

На світлих фонах використовуйте стандартний логотип, а на темних і бордових інвертовану версію. На фотографіях розміщуйте логотип лише на спокійній, рівномірній ділянці з достатнім контрастом.

03 · Помилки

Ніколи не використовуйте логотип так

  • Не змінюйте кольори

    Не змінюйте кольори

    Логотип завжди використовується в офіційних кольорах або в затверджених інвертованій і чорно-білій версіях.

  • Не деформуйте

    Не деформуйте

    Не розтягуйте, не стискайте й не нахиляйте логотип. Його пропорції незмінні.

  • Не змінюйте шрифт

    Не змінюйте шрифт

    Літери є частиною знака. Ніколи не набирайте їх іншим шрифтом.

  • Не додавайте ефектів

    Не додавайте ефектів

    Жодних тіней, світіння, обведень чи градієнтів.

  • Не повертайте

    Не повертайте

    Логотип завжди горизонтальний або в затвердженій вертикальній версії, ніколи під кутом.

  • Не розміщуйте на строкатому фоні

    Не розміщуйте на строкатому фоні

    Строкаті, візерункові або малоконтрастні фони роблять логотип нечитабельним.

04 · Кольори

Офіційна палітра

Lailio використовує лише ці шість кольорів. Бордовий і темно-синій несуть бренд, шкала блакитних відтінків його доповнює. Для кожного кольору показано версію логотипа, затверджену для використання на ньому.

  • Крижаний блакитний

    Фони, площини

    HEX
    #C9DDF2
    RGB
    200/221/242
    CMYK
    19/6/0/0
    Pantone
    545 C

  • Світло-блакитний

    Графічні елементи

    HEX
    #A2CBEC
    RGB
    161/203/236
    CMYK
    34/9/0/0
    Pantone
    277 C

  • Середній блакитний

    Графічні елементи

    HEX
    #86BBE2
    RGB
    134/187/228
    CMYK
    45/14/1/0
    Pantone
    278 C

  • Блакитний Lailio

    Акценти, посилання на темному фоні

    HEX
    #669ACD
    RGB
    103/153/203
    CMYK
    60/30/2/0
    Pantone
    7453 C

  • Бордовий Lailio

    Основний колір бренду, кнопки, акценти

    HEX
    #57274C
    RGB
    87/38/76
    CMYK
    58/88/36/41
    Pantone
    262 C

  • Темно-синій Lailio

    Заголовки, текст, темні площини

    HEX
    #35325C
    RGB
    53/50/91
    CMYK
    87/85/33/30
    Pantone
    5265 C

Світліші й темніші відтінки

Світліші відтінки використовуйте для фонів і виділень, темніші для активних станів і тексту. Ніколи не використовуйте кольори поза цією шкалою.

05 · Типографіка

Два шрифти, чіткі ролі

Poppins є голосом бренду в заголовках і рекламі, часто великими літерами. Open Sans використовується для всього основного тексту й замінює Poppins там, де він недоступний. Обидва шрифти розміщені на самому вебсайті, без зовнішніх запитів.

Poppins Заголовки та реклама, часто великими літерами

Poppins

Розумні рішення. Виняткові результати.

  • Light300
  • Regular400
  • Medium500
  • Semi-Bold600
  • Bold700
Open Sans Основний текст, інтерфейс, форми

Open Sans

Основний текст набирається шрифтом Open Sans із комфортним міжрядковим інтервалом. Абзаци короткі, починаються з результату, а твердження підкріплені фактами.

  • Light300
  • Regular400
  • Semi-Bold600
  • Bold700

Шкала заголовків вебсайту

  1. H1Розумні рішення. Виняткові результати.
  2. H2Розумні рішення. Виняткові результати.
  3. H3Розумні рішення. Виняткові результати.
  4. H4Розумні рішення. Виняткові результати.
  5. H5Розумні рішення. Виняткові результати.
  6. H6Розумні рішення. Виняткові результати.

У друці

Візитна картка: ім'я Poppins Bold 10 pt, контактні дані Poppins Light 6,5 pt. Нижній колонтитул бланка: Poppins Light 7 pt.

06 · Графічна мова

Трикутники з логотипа

Візерунок бренду складається з тих самих трикутників, що й логотип. Він додає руху й ритму, але ніколи не конкурує з контентом.

  1. 01

    Лише кольори палітри

    Трикутники мають лише офіційні кольори, ніколи не градієнти.

  2. 02

    Білий проміжок

    Між трикутниками завжди є тонка біла лінія.

  3. 03

    Пласко

    Жодних тіней, глибини чи ефектів прозорості.

  4. 04

    По краях, не в центрі

    Візерунок заходить із кута чи краю й залишає місце для контенту та логотипа.

Трикутники з логотипа

07 · Вебстандарти

Як бренд живе на вебсайті

Ці правила закладено в код lailio.com. Вони застосовуються до кожної нової сторінки та компонента.

  1. 01

    Плаский дизайн

    Жодних тіней, ніде й ніколи. Глибину створюють площини й лінії, а не тіні.

  2. 02

    Гострі кути

    Жодних заокруглень: кнопки, картки, зображення та форми є прямокутниками.

  3. 03

    Тонкі лінії

    Блоки розділяє лінія 1 px #E2E8F0; картки розміщені в одній рамці без проміжків.

  4. 04

    Чорний лише для тексту

    Чорний колір дозволений лише для тексту, ніколи для ліній чи площин.

  5. 05

    Видимий фокус

    Фокус клавіатури є бордовим контуром 2 px, а не світінням.

  6. 06

    Без довгих тире

    У текстах використовуйте двокрапку або кому, ніколи довге тире.

Змінні CSS

08 · Іконки

Прості, без рамок

Вебсайт використовує Bootstrap Icons. Іконки лінійні, без кіл на фоні та рамок, бордового або темно-синього кольору. Ніколи не перефарбовуйте логотипи партнерів чи третіх сторін у кольори бренду.

  • bi-shield-check
  • bi-hdd-network
  • bi-cpu
  • bi-database
  • bi-cloud
  • bi-diagram-3
  • bi-gear-wide-connected
  • bi-graph-up-arrow
  • bi-people
  • bi-briefcase
  • bi-geo-alt
  • bi-telephone
  • bi-envelope
  • bi-calendar-check
  • bi-clock
  • bi-lightbulb
  • bi-boxes
  • bi-layers
  • bi-globe2
  • bi-patch-check
  • bi-speedometer2
  • bi-activity
  • bi-robot
  • bi-arrow-right

09 · Тон комунікації

Як звучить Lailio

  1. 01

    Зрозуміло, а не мудровано

    Проста мова й конкретні результати. Без модних слівець і порожніх обіцянок.

  2. 02

    Мисли глобально, дій локально

    Заснована в Ризі, працює по всій Європі. Ми говоримо як інженер, який розуміє бізнес клієнта.

  3. 03

    Завжди на зв'язку

    Надійність 24/7 є обіцянкою, а не гаслом. Ми підкріплюємо твердження цифрами, SLA та референсами.

  4. 04

    Кожною мовою

    Кожен текст існує всіма мовами вебсайту. Основою є латиська або англійська, а переклади звучать природно.

10 · Застосування

Друк і мерч

Формати, шрифти та розміри з офіційного посібника зі стилю.

  • Візитна картка
    Візитна картка90 × 50 mm · Poppins Bold 10 pt, Poppins Light 6,5 pt
  • Фірмовий бланк
    Фірмовий бланкA4, 210 × 297 mm · нижній колонтитул Poppins Light 7 pt
  • Конверт
    КонвертC65 · логотип і візерунок із трикутників
  • Папка
    Папка225 × 320 mm · зовнішній і внутрішній бік
  • Чашка
    ЧашкаПовний друк із візерунком із трикутників
  • Макет друку на чашці
    Макет друку на чашціВізерунок і логотип на білому
  • Футболка
    ФутболкаБордова основа, інвертований логотип
  • Ручка та олівець
    Ручка та олівецьБордовий, інвертований логотип
  • Кепка
    КепкаБордова, інвертований вертикальний логотип

Підпис електронного листа

Ім'я, посада, телефон, електронна пошта та горизонтальний логотип. Компактний, шрифтами бренду, без інших зображень.

11 · Завантаження

Файли