Automatic background - text luminance correction #614

New issue

Closed

opened 2026-02-20 10:19:10 -05:00 by deekerman · 0 comments

deekerman commented

2026-02-20 10:19:10 -05:00

Owner

Originally created by @96LawDawg on GitHub (Dec 12, 2022).

@rogerl50 just put a nice function into the scoreboard to automatically create the right contrast between light backgrounds and black text and darker backgrounds and white text. Many times, I would have loved to have been able to do that automatically in JSON. I thought about building a routine, but it was never worth the effort. Could something be built behind the scenes and we invoke it through some variable or property? Maybe add a new variable like "playerContrastColor" for either black or white to use with "playerColor." Something like:

"css": {
    "background": "${PROPERTY backColor}",
    "color": "${PROPERTY textColor}"
  },

  "clickRoutine": [
    {
      "func": "SET",
      "collection": "thisButton",
      "property": "backColor",
      "value": "${playerColor}"
    },
    {
      "func": "SET",
      "collection": "thisButton",
      "property": "textColor",
      "value": "${playerContrastColor}"
    }
  ]
}

Originally created by @96LawDawg on GitHub (Dec 12, 2022). @rogerl50 just put a nice function into the scoreboard to automatically create the right contrast between light backgrounds and black text and darker backgrounds and white text. Many times, I would have loved to have been able to do that automatically in JSON. I thought about building a routine, but it was never worth the effort. Could something be built behind the scenes and we invoke it through some variable or property? Maybe add a new variable like "playerContrastColor" for either black or white to use with "playerColor." Something like: ``` "css": { "background": "${PROPERTY backColor}", "color": "${PROPERTY textColor}" }, "clickRoutine": [ { "func": "SET", "collection": "thisButton", "property": "backColor", "value": "${playerColor}" }, { "func": "SET", "collection": "thisButton", "property": "textColor", "value": "${playerContrastColor}" } ] } ```