1

знающие люди подскажите пожалуйста как изменить цвет border-а иконки, другими словами сделать иконку белой и задать нужный цвет контура, как на фото, заранее спасибо! введите сюда описание изображения

1 ответ 1

1

Это эксперимент с бесплатной иконкой:

.icon-free {
  height: 130px;
  width: 170px;
  fill: #ffffff;
  stroke: #7d9cbb;
  stroke-width: 30;
}
<svg class="icon-free" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512">
  <path d="M622.34 153.2L343.4 67.5c-15.2-4.67-31.6-4.67-46.79 0L17.66 153.2c-23.54 7.23-23.54 38.36 0 45.59l48.63 14.94c-10.67 13.19-17.23 29.28-17.88 46.9C38.78 266.15 32 276.11 32 288c0 10.78 5.68 19.85 13.86 25.65L20.33 428.53C18.11 438.52 25.71 448 35.94 448h56.11c10.24 0 17.84-9.48 15.62-19.47L82.14 313.65C90.32 307.85 96 298.78 96 288c0-11.57-6.47-21.25-15.66-26.87.76-15.02 8.44-28.3 20.69-36.72L296.6 284.5c9.06 2.78 26.44 6.25 46.79 0l278.95-85.7c23.55-7.24 23.55-38.36 0-45.6zM352.79 315.09c-28.53 8.76-52.84 3.92-65.59 0l-145.02-44.55L128 384c0 35.35 85.96 64 192 64s192-28.65 192-64l-14.18-113.47-145.03 44.56z"></path>
</svg>

Но, Вам то нужна другая, так? ;-)

.not-free { width: 170px; height: 130px; }
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512" class="not-free"><path fill="currentColor" d="M606.72 147.91l-258-79.57c-18.81-5.78-38.62-5.78-57.44 0l-258 79.57C13.38 154.05 0 171.77 0 192.02s13.38 37.97 33.28 44.11l22.64 6.98c-2.46 5.19-4.4 10.62-5.7 16.31C39.53 264.6 32 275.33 32 288.01c0 10.78 5.68 19.85 13.86 25.65L20.33 428.53C18.11 438.52 25.71 448 35.95 448h56.11c10.24 0 17.84-9.48 15.62-19.47L82.14 313.66c8.17-5.8 13.86-14.87 13.86-25.65 0-10.6-5.49-19.54-13.43-25.36 1.13-3.55 2.96-6.67 4.85-9.83l54.87 16.92L128 384c0 35.34 85.96 64 192 64s192-28.65 192-64l-14.28-114.26 109-33.62c19.91-6.14 33.28-23.86 33.28-44.11s-13.38-37.96-33.28-44.1zM462.44 374.47c-59.7 34.2-225.9 33.78-284.87 0l11.3-90.36 102.42 31.59c11.15 3.43 32.24 7.77 57.44 0l102.42-31.59 11.29 90.36zM334.59 269.82c-9.44 2.91-19.75 2.91-29.19 0L154.62 223.3l168.31-31.56c8.69-1.62 14.41-9.98 12.78-18.67-1.62-8.72-10.09-14.36-18.66-12.76l-203.78 38.2c-6.64 1.24-12.8 3.54-18.71 6.27L53.19 192l252.22-77.79c9.44-2.91 19.75-2.91 29.19 0l252.22 77.82-252.23 77.79z" class=""></path></svg>

3
  • Как я понял из вопроса, ТС нужно перекрасить подключенную иконку fontawesome. Другими словами без кода SVG иконки, только стили 30 мар 2020 в 9:25
  • @Alexandr_TT: для этого нужен пример минимальный со ссылками на ресурсы. А так-то, если для обычного шрифта, то — color: white; и text-shadow:* или -webkit-text-stroke:* — все дела. (иконки выше - это оригиналы из fontawesome)
    – UModeL
    30 мар 2020 в 9:37
  • согласен, всё как обычно (((( Если бы ТС задал нормально оформленный вопрос, то наверное и сам бы смог ответить на него 30 мар 2020 в 9:47

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.