diff --git a/core/src/components/checkbox/checkbox.ios.vars.scss b/core/src/components/checkbox/checkbox.ios.vars.scss
index 6636b7448d6..8a7ff09321c 100644
--- a/core/src/components/checkbox/checkbox.ios.vars.scss
+++ b/core/src/components/checkbox/checkbox.ios.vars.scss
@@ -14,7 +14,7 @@ $checkbox-ios-background-color-on:        ion-color(primary, base) !default;
 $checkbox-ios-background-color-focused:   ion-color(primary, tint) !default;
 
 /// @prop - Size of the checkbox icon
-$checkbox-ios-icon-size:                  24px !default;
+$checkbox-ios-icon-size:                  26px !default;
 
 /// @prop - Border color of the checkbox icon when off
 $checkbox-ios-icon-border-color-off:      $item-ios-border-color !default;
diff --git a/core/src/components/checkbox/checkbox.md.vars.scss b/core/src/components/checkbox/checkbox.md.vars.scss
index 5e244a8f942..135b2e01329 100644
--- a/core/src/components/checkbox/checkbox.md.vars.scss
+++ b/core/src/components/checkbox/checkbox.md.vars.scss
@@ -17,7 +17,7 @@ $checkbox-md-background-color-focused:   ion-color(primary, tint) !default;
 $checkbox-md-icon-background-color-on:   ion-color(primary, base) !default;
 
 /// @prop - Size of the checkbox icon
-$checkbox-md-icon-size:                  14px !default;
+$checkbox-md-icon-size:                  18px !default;
 
 /// @prop - Width of the checkbox icon checkmark
 $checkbox-md-icon-checkmark-width:       2px !default;
diff --git a/core/src/components/checkbox/checkbox.scss b/core/src/components/checkbox/checkbox.scss
index d659da627c7..441905d200c 100644
--- a/core/src/components/checkbox/checkbox.scss
+++ b/core/src/components/checkbox/checkbox.scss
@@ -42,6 +42,7 @@ input {
 .checkbox-icon {
   @include border-radius(var(--border-radius));
 
+  display: block;
   position: relative;
 
   width: var(--width);
@@ -56,6 +57,7 @@ input {
   background: var(--background);
 
   contain: strict;
+  box-sizing: border-box;
 }
 
 .checkbox-icon path {