Домашня » Інструментарій » Мікон - Windows 10 Шрифт іконок для веб-дизайнерів

    Мікон - Windows 10 Шрифт іконок для веб-дизайнерів

    The редизайн для Windows 10 прийшло з багатьма новими функціями та новим виглядом. Одна з найбільших змін прийшла до стилю іконок, особливо в порівнянні з Windows 7 і XP.

    Завдяки Мікон набір, Ви можете зараз принести Win10-стиль іконки прямо на ваш сайт.

    Цей пакет значків поставляється як шрифт іконок і це випущено безкоштовно через GitHub. Основний репо має інформацію про налаштування, але головну сторінку Мікона має всі іконки на дисплеї з відповідними іменами класів.

    Фактична структура веб-сайту подібний формат до шрифту Awesome. Ти можеш переглядати всі піктограми Натисніть будь-яку з них, щоб отримати докладніші відомості про нову сторінку.

    Наприклад, візьміть цю піктограму зарядки акумулятора, яка використовує дизайн батареї та невелику зарядку. Ви отримаєте попередній перегляд піктограми різних розмірів, разом з клас іконок CSS, в цьому випадку mi-BatteryCharging10.

    Цей набір іконок також працює так само, як шрифт Awesome, де ви можете вставляйте піктограми прямо в HTML. Фрагмент коду цієї піктограми акумулятора працює так само:

      

    Це дуже просто, щоб почати роботу, з просто копію таблиці стилів Micon CSS і деякі базові знання фронтального розвитку.

    Перевірте сторінки налаштування дізнатися більше. Дійсно, вам просто потрібно завантажити копію пакета Micon від GitHub і включіть цю таблицю стилів (разом із відповідними шрифтами піктограм) на сторінку. Звідти просто посилання на імена класів як вище, і ви добре йти.

    Оскільки цей проект відкритий, ви вільно використовувати ці іконки з будь-яким проектом, особистим чи комерційним. І навіть можна створити свій власний файл дотримуючись інструкцій з побудови Micon GitHub. Таким чином ви можете пакуйте тільки потрібні піктограми у файли шрифтів і зменшити загальний розмір файлу.

    В цілому, я дуже вражений різноманітність ікон і легка установка. Ви можете знайти безліч прикладів на веб-сайті та навіть анімовані іконки на сторінці Приклади, яка містить фрагменти коду.

    Ці іконки навіть добре працювати з Bootstrap, так що ви можете поєднати його з базою BS3 / BS4 для деяких реальних нестандартних макетів.

    Завантажте безкоштовне авторське право з домашньої сторінки Micon і ознайомтеся з тим, як ви можете працювати з цими іконками у стилі Windows 10 у наступному проекті.