Checkbox background color

p5.js Coding Questions
#1

I’m trying to change the background color of a checkbox.

in css I have tried:

input[type="checkbox"] {
  position: relative;
  appearance: none;
  background-color: #2ecc71;
  color: #49400c;
}

this does not work. And in JS im trying:

      checkbox.style("background-color", "black");
      checkbox.style("color", "white");

How can I change the background of the checkbox and where are the JS .style() messages documented?

Thanks a lot!

#2

Hi,

A checkbox does not have a background color. Check those links :

So you either need to use a wrapping div or use :before and :after to add a background color :wink:

1 Like
#3

Thanks a lot for the links, they are useful information.
I think I got it now, but it’s not clear to me how will I color every checkbox differently.
In my code, I have an array of checkboxes and I need to color them independently.
How would I reference my checkbox array from css?