SVG не «мылится» при масштабировании и отлично подходит для тем, hover‑эффектов и адаптива. Но перекраска зависит от способа подключения: не везде CSS может достучаться до path. Рабочие варианты (по ситуации): - Inline SVG в HTML — максимум контроля. Делайте fill: currentColor; и меняйте цвет через обычный color у кнопки/ссылки. - SVG‑спрайт (<symbol> + <use>) — удобно для проекта с кучей иконок. Лучше инлайновый спрайт в документе, тогда стилизация стабильнее. - Компонент (React/Vue) — тот же inline, но с пропсами/классами. Внутри: fill="currentColor" или stroke="currentColor". - <img src="icon.svg"> — быстро, но внутрь SVG CSS не залезет: fill на img не сработает. - background-image — для декора; динамически перекрашивать обычно нельзя. - mask-image + background-color — лайфхак для внешнего SVG, если нужна одноцветная иконка (работает как трафарет). Почему “не красится”: - внутри SVG захардкожен fill="#000" → уберите или замените на currentColor - пытаетесь красить img/background →