0

No matter now I style this, I can't get the icon to appear in the fixed top navbar with Bootstrap 4 with the colour I want. I tried both the fill/color attributes:

<script src="static/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="static/css/bootstrap.min.css" type="text/css" />
<nav class="navbar navbar-expand-sm navbar-dark fixed-top bg-dark">
   <div class="navbar-brand">
      <img style="fill:white; width:32px; height:32px;" src="static/images/si-glyph-disc-upload.svg" />
   </div>
Tan Duong
  • 2,124
  • 1
  • 11
  • 17
farhany
  • 1,243
  • 2
  • 17
  • 29

1 Answers1

0

You cannot use fill attribute on SVG image which is loaded using an <img> tag. Instead, you can change the color using CSS filter attributes.

Example in this answer: https://stackoverflow.com/a/44252082/1115262

Otherwise you can embed your image as an inline SVG: img src SVG changing the fill color

Stichoza
  • 4,491
  • 2
  • 23
  • 24