diff --git a/packages/opendesign/src/checkbox/style/index.scss b/packages/opendesign/src/checkbox/style/index.scss
index e6b6f59b06731c7cec52d32669a01b1cb474daeb..8bb47c5840ef5591b0176e882570a9878c439b64 100644
--- a/packages/opendesign/src/checkbox/style/index.scss
+++ b/packages/opendesign/src/checkbox/style/index.scss
@@ -1,3 +1,3 @@
 @use './style.scss' as *;
-@use './media.scss' as *;
 @use './var.scss' as *;
+@use './media.scss' as *;
diff --git a/packages/opendesign/src/checkbox/style/media.scss b/packages/opendesign/src/checkbox/style/media.scss
index 11fcbaec06604d9c7e8821c4fd80618286dfc99f..f7ca3b79ff0cd7014d004917cac32195b0de2dc0 100644
--- a/packages/opendesign/src/checkbox/style/media.scss
+++ b/packages/opendesign/src/checkbox/style/media.scss
@@ -1,6 +1,6 @@
 @use '../../_styles/mixin.scss' as *;
 
-@include respond-to('<=laptop') {
+@include respond-to('pad_v-pc_s') {
   .o-checkbox {
     --checkbox-text-size: var(--o-font_size-tip1);
     --checkbox-text-height: var(--o-line_height-tip1);
diff --git a/packages/opendesign/src/checkbox/style/theme-ascend.scss b/packages/opendesign/src/checkbox/style/theme-ascend.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0b98e32799ae444bbeb034cb6a326fff7d27b9eb 100644
--- a/packages/opendesign/src/checkbox/style/theme-ascend.scss
+++ b/packages/opendesign/src/checkbox/style/theme-ascend.scss
@@ -0,0 +1,10 @@
+.o-checkbox {
+  --checkbox-input-bd-color-hover: var(--o-color-control2);
+  --checkbox-input-bd-color-active: var(--o-color-control3);
+}
+
+[data-o-theme*='dark'] {
+  .o-checkbox {
+    --checkbox-input-icon-color: var(--o-color-control1-light);
+  }
+}
diff --git a/packages/opendesign/src/checkbox/style/theme-kunpeng.scss b/packages/opendesign/src/checkbox/style/theme-kunpeng.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0b98e32799ae444bbeb034cb6a326fff7d27b9eb 100644
--- a/packages/opendesign/src/checkbox/style/theme-kunpeng.scss
+++ b/packages/opendesign/src/checkbox/style/theme-kunpeng.scss
@@ -0,0 +1,10 @@
+.o-checkbox {
+  --checkbox-input-bd-color-hover: var(--o-color-control2);
+  --checkbox-input-bd-color-active: var(--o-color-control3);
+}
+
+[data-o-theme*='dark'] {
+  .o-checkbox {
+    --checkbox-input-icon-color: var(--o-color-control1-light);
+  }
+}