TIP: Changing the colour of Bootrap Icons

You may want to change the colour of Bootstrap Icons to match your website.

  • Open the SVG file in a text editor
  • Edit the “fill” element in line 1 with your color
    eg. “svg xmlns=“SVG namespace” width=“20” height=“20” fill=”#5f93bd" class=“bi bi-globe” viewBox=“0 0 16 16"”

Do this for all the icons you use
No need to amend CSS or other solutions
Include the icon in your page <img src="/img/globe.svg" >