Задать вопрос
@olega7or
Digital designer
html

Как изменить цвет stroke в svg?

Есть svg спрайт,
в нем есть инонки вида
<symbol viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" id="menu">
    <path d="M6 24h36M6 12h36M6 36h36" stroke="#fff" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"></path>
  </symbol>


Вставляю нужную иконку таким образом
<svg className="icon">
          <use xlinkHref="/img/sprite.svg#menu" />
        </svg>


.icon {
        stroke: red
    }

Так не меняет

Как правильно изменить цвет stroke через css?
  • Вопрос задан
  • 2957 просмотров
2 комментария
Подписаться 1 Простой 2 комментария
Решения вопроса 1
LenovoId
@LenovoId Куратор тега SVG
svg, css,js
Для того что бы заработало внутри use надо удалить все стилизации внутри symbol
Ответ написан
1 комментарий
1 комментарий
Пригласить эксперта
Ответы на вопрос 1
Henxed
@Henxed
svg спрайт нужно встроить в html, файлом работать не будет, и через css просто менять параметр. Например:
#menu path{
  stroke: #000;
}

Ответ написан
5 комментариев
5 комментариев
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Доработать телеграм бота
19 апр. 2024, в 03:52
1000 руб./за проект
Написать код на python
19 апр. 2024, в 03:01
1000 руб./за проект
Настройка сервера
18 апр. 2024, в 21:56
2000 руб./за проект
Ещё заказы