Nav toogle color

Yep, since BS4 its all SVG, so lots of fun.

Using the Inspector in Safari, it shows this code for the horizontal dots.

You will need to adjust the RGBa values for colouring.

.navbar-light .menu-icon-circles .navbar-toggler-icon{
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='rgba(0, 0, 0, 0.5)' d='M15.5,12A3.5,3.5,0,1,1,12,15.5,3.5,3.5,0,0,1,15.5,12Zm11,0A3.5,3.5,0,1,1,23,15.5,3.5,3.5,0,0,1,26.5,12Zm-22,0A3.5,3.5,0,1,1,1,15.5,3.5,3.5,0,0,1,4.5,12Z'/%3E%3C/svg%3E");
}

The Safari Inspector is excellent. If you don’t have it activates. Safari → Preferences → Advanced → Tick the develop checkbox at the bottom. You will have a new dropdown menu appear called Developer with a bunch of useful tools.

1 Like