I am trying to use the Checkbox from

CodePudding user response：

Paste this in your CSS this will be applied to all the checkboxes in your element.

.ms-Checkbox:not(.is-checked):hover .ms-Checkbox-checkmark{
  display:none;
}

In case you want to apply only for a specific checkbox make it a class like this

Inside your CSS

.custom-checkbox:not(.is-checked):hover .ms-Checkbox-checkmark{
  display:none;
}

In your react component [Note] this example is from the Microsoft website you provided

<Checkbox label="Unchecked checkbox (uncontrolled)" onChange={_onChange} className="custom-checkbox" />