Adding a halo or background color around tool buttons

When using an background layer with satellite images, the toolbar buttons are sometimes hard to read. In these cases it can be useful to add a background color behind or a halo around the tool buttons. This only works when using SVG sprite (which is the default setting for new viewers).

The following CSS code should be added to the 'Extra CSS code` field in the layoutmanager.

To add a background color behind the buttons (adds a half-transparent white background):

.svg-tool svg { background-color: rgba(255, 255, 255, 0.5) }

To add a "halo" around the buttons (a real halo is not possible, this example adds a white shadow behind the tool):

.svg-tool svg { filter: drop-shadow(0px 0px 1px #FFFFFF); }