@sdetweil said in nhancing Text Readability on Bright Wallpapers: Adding Background Textures or Boxes with CSS?:
@Socrates maybe invert
https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function/invert
i dont know if its live or at draw time assuming a stable background
mixed blend mode sounds better
https://css-tricks.com/reverse-text-color-mix-blend-mode/
Hello and Good Evening Sam, thanks for looking into my posts and helping with your valuable tips as always.
I found something that might interest you too.
Check out
MMM-Glassy module.
https://github.com/bugsounet/MMM-Glassy
I was able to achieve this. In this module u dont need to add css layers for each module, they will automatically show up in all the modules u have. Infact you can add exceptions to which u dont want the mmm-glassy module wrap around the module.

This is how i did it.
{
module: "MMM-Glassy",
disabled: false,
config: {
debug: false,
ignoreModules: ["MMM-Worldclock","MMM-Remote-Control","MMM-OpenmapWeather","MMM-OpenWeatherMapForecast","MMM-Mov>
modulePadding: "10px",
moduleRadius: "10px",
moduleShadow: "5px",
moduleBackgroundRGB: "0,0,0",
moduleBackgroundOpacity: "15%",
moduleBorderRGB: "255,255,255",
moduleBorderOpacity: "10%",
moduleShadowOffsetX: "-5px",
moduleShadowOffsetY: "-5px",
moduleShadowBlur: "8px",
moduleShadowColor: "black",
moduleBlur: "5px",
moduleSpacing: "15px",
mirrorMargin: "10px",
mirrorBackground: false,
mirrorBackgroundOnSuspend: true
}
},