Is it possible to change fill color of the modal ?

[gaisinskii]

Hello there!

I wonder if it possible to change the fill color of the modal overlay ?

By default it is fill="#FFFFFF", let's say I want to change it to red (#ff0000) but nothing happens. The overlay is just brighter but does not become red. Am I doing something wrong?

[hodossy]

Yes it is, you just need to set a fill on the last rect, not the mask:

There is more here on masks: http://tutorials.jenkov.com/svg/mask.html#using-fill-patterns-in-masks

[gaisinskii]

@hodossy Thanks, man! It was a bit tricky for me as changing the CSS fill does not fix the issue. But adding an attribute via js works.

const tutorialOverlay = document.getElementById(
        'shepherdModalOverlayContainer',
      ).childNodes[1];
tutorialOverlay.setAttribute('fill', '#020b17');

[RobbieTheWagner]

@andy-noir if you wanted to make this a configurable thing, and open a PR for it, I would love to support this more easily!