Skip to main content
Customize the Action Checkbox with CSS

Learn how to customize the border color and checked state of action checkboxes in your course using CSS.

Updated over 3 months ago

To get started:

  • Open any course and open the Course Settings section

  • Open the CSS sub-section

  • Set the Enable Custom CSS For This Course toggle to ON (green)

  • You should then see the CSS field appear. Add your CSS code to that box alongside any other code you may have already added to it.

Customize the checkbox border color

You may want to change the color of the checkbox border – here's the CSS rule to use:

[id^=action-checkbox] { border-color:pink; }

Customize the action checkbox

You may want to change the color of the checkbox once it's been checked off. Right now the checkbox is a specific shade of green – here's how to change it.

.custom-checkbox-complete { background-color:red !important; } }

Did this answer your question?