diff --git a/src/vs/base/browser/ui/checkbox/checkbox.css b/src/vs/base/browser/ui/checkbox/checkbox.css
index 972e94f7175c6700ff0321cebd1a72123869cd1b..c754adc15182ada6824bb9df01aafae0e27ab6ad 100644
--- a/src/vs/base/browser/ui/checkbox/checkbox.css
+++ b/src/vs/base/browser/ui/checkbox/checkbox.css
@@ -45,6 +45,6 @@
 }
 
 /* hide check when unchecked */
-.monaco-custom-checkbox.monaco-simple-checkbox.unchecked:not(.checked)::before {
-	visibility: hidden;;
+.monaco-custom-checkbox.monaco-simple-checkbox:not(.checked)::before {
+	visibility: hidden;
 }
diff --git a/src/vs/base/browser/ui/checkbox/checkbox.ts b/src/vs/base/browser/ui/checkbox/checkbox.ts
index c71bea70e3bac21a1abaaf2491651596b30969d3..c3b0e243f9140ac97a336d63756a029bc35cc7f6 100644
--- a/src/vs/base/browser/ui/checkbox/checkbox.ts
+++ b/src/vs/base/browser/ui/checkbox/checkbox.ts
@@ -108,7 +108,9 @@ export class Checkbox extends Widget {
 		if (this._opts.actionClassName) {
 			classes.push(this._opts.actionClassName);
 		}
-		classes.push(this._checked ? 'checked' : 'unchecked');
+		if (this._checked) {
+			classes.push('checked');
+		}
 
 		this.domNode = document.createElement('div');
 		this.domNode.title = this._opts.title;
@@ -154,12 +156,9 @@ export class Checkbox extends Widget {
 
 	set checked(newIsChecked: boolean) {
 		this._checked = newIsChecked;
+
 		this.domNode.setAttribute('aria-checked', String(this._checked));
-		if (this._checked) {
-			this.domNode.classList.add('checked');
-		} else {
-			this.domNode.classList.remove('checked');
-		}
+		this.domNode.classList.toggle('checked', this._checked);
 
 		this.applyStyles();
 	}