Не так давно в мобильных браузерах появилась новая фишка — покраска вкладки в уникальный цвет. В данной статье мы поговорим, для чего это нужно и как это реализовать с помощью мета-тегов.

Для чего это все?

В современном мире сайты уже трудно назвать обычными веб-страницами. Многие из них походят на полноценные веб-приложения. Многе мобильные браузеры поддерживают эту тенденцию, и, чтобы сайты стали чуть-больше похожими на приложения они и добавили такую интересную функцию.

Как сделать?

На самом деле, все просто! Добавив пару строчек в <head> Вашей страницы вы придадите уникальность Вашему сайту!

Вот пример для самых популярных браузеров:

<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="#4285f4" />

<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#4285f4" />

<!-- iOS Safari -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-transcluent" />

<!-- Яндекс.Браузер -->
<meta name="viewport" content="ya-title=#000000,ya-dock=fade" />