Bootstrap tooltip arrow border and background color

Question

How do I change the background color and border color of the tooltip arrow? I\'m using Bootstrap 4.

Answer 1

I was able to get it to work doing something similar to what Temani Afif suggested. However we ended up changing over to using popovers instead so we could apply a popover-box-shadow. Bootstrap popovers are just like tooltips except they come with a border so none of that fussing with the overlapping arrows was necessary. Plus when using scss you can do the vast majority of styling just by modifying the variables.scss file.

In order to change the background color of the popover see this answer: Change bootstrap popover background color