ic-blog
Один стиль на весь сайт: сетка 24×24, толщина линии 1.75, только обводка, цвет наследуется от текста. Сейчас на сайте смесь эмодзи и разномастных картинок ✗ — этот набор их заменяет.
| Параметр | Значение | Зачем |
|---|---|---|
| Сетка | 24×24 | все иконки выравниваются между собой |
| Толщина линии | 1.75 | одинаковый вес, не жирнит и не бледнит |
| Тип | только обводка, без заливки | легко читается и на белом, и на зелёном |
| Цвет | currentColor | иконка всегда в цвет текста рядом |
| Концы линий | скруглённые | мягче смотрится, современнее |
| Размеры | 18 · 24 · 32 · 48 | мелкая в подписи, обычная в меню, крупная в карточке |
icons.svg и подключаются одной строкой.Один файл icons.svg лежит в корне сайта. Иконка вставляется одной строкой:
<svg class="ic"><use href="/icons.svg#ic-tree"></use></svg>
<svg class="ic ic-lg"><use href="/icons.svg#ic-uk"></use></svg> <!-- крупнее -->ic, ic-sm, ic-lg, ic-xl уже добавлены
в общий файл стилей — на всех страницах набор заработает сразу, без отдельных подключений.