diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbcheckbox.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbcheckbox.directive.js
index 0f3d251e82..eb3c134f0b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbcheckbox.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbcheckbox.directive.js
@@ -31,6 +31,7 @@
 @param {boolean} disabled Set the checkbox to be disabled.
 @param {boolean} required Set the checkbox to be required.
 @param {callback} onChange Callback when the value of the checkbox change by interaction.
+@param {string} cssClass Set a css class modifier
 
 **/
 
@@ -78,7 +79,8 @@
             serverValidationField: "@",
             disabled: "<",
             required: "<",
-            onChange: "&?"
+            onChange: "&?",
+            cssClass: "@?"
         }
     };
 
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-form-check.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-form-check.less
index 22975ec6bb..7f19c4933c 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-form-check.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-form-check.less
@@ -12,6 +12,14 @@
     line-height: 22px;
     cursor: pointer !important;
 
+    &.-small-text{
+        font-size: 13px;
+    }
+
+    &.-bold{
+        font-weight: 700;
+    }
+
     &__text {
         margin: 0 0 0 26px;
         position: relative;
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-checkbox.html b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-checkbox.html
index c35c600ce1..57a4fdae05 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-checkbox.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-checkbox.html
@@ -1,4 +1,4 @@
-<label class="checkbox umb-form-check umb-form-check--checkbox" ng-class="{ 'umb-form-check--disabled': vm.disabled }">
+<label class="checkbox umb-form-check umb-form-check--checkbox {{vm.cssClass}}" ng-class="{ 'umb-form-check--disabled': vm.disabled }">
     <input type="checkbox"
            id="{{vm.inputId}}"
            name="{{vm.name}}"
diff --git a/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html b/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
index faf45afaae..7da38183b6 100644
--- a/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
+++ b/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
@@ -97,10 +97,15 @@
                         </div>
 
                         <div class="umb-info-local-item mt4 flex items-center flex-column" ng-if="vm.installState.status == ''">
-                            <label for="confirm-uninstall" class="umb-package-installer-label">
-                                <input type="checkbox" id="confirm-uninstall" ng-model="vm.package.confirmUninstall" required no-dirty-check>
-                                <strong class="label-text"><localize key="packager_packageUninstallConfirm">Confirm package uninstall</localize></strong>
-                            </label>
+
+                            <umb-checkbox
+                                css-class="-small-text -bold"
+                                model="vm.package.confirmUninstall"
+                                text="Confirm package uninstall"
+                                label-key="packager_packageUninstallConfirm"
+                                required="true">
+                            </umb-checkbox>
+
                             <umb-button
                                 class="mt3"
                                 type="button"