diff --git a/packages/opendesign/src/badge/OBadge.vue b/packages/opendesign/src/badge/OBadge.vue
index f2179454c98f6937e1cf3e0e974406f1cfe5040e..cb096fae652369e07d5b57dd1670bf04b49b09fa 100644
--- a/packages/opendesign/src/badge/OBadge.vue
+++ b/packages/opendesign/src/badge/OBadge.vue
@@ -18,7 +18,7 @@ const content = computed(() => {
 
 const style = computed(() => {
   const [x, y] = props.offset;
-  const right = isNumber(x) ? `-${x}px` : `-${x}`;
+  const right = isNumber(x) ? `${x * -1}px` : `calc(${x} * -1)`;
   const top = isNumber(y) ? `${y}px` : `${y}`;
   return {
     right,
diff --git a/packages/opendesign/src/badge/style/index.scss b/packages/opendesign/src/badge/style/index.scss
index e6b6f59b06731c7cec52d32669a01b1cb474daeb..8bb47c5840ef5591b0176e882570a9878c439b64 100644
--- a/packages/opendesign/src/badge/style/index.scss
+++ b/packages/opendesign/src/badge/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/badge/style/media.scss b/packages/opendesign/src/badge/style/media.scss
index f7a9a3d65833824fa226a36e32e29f0f96bab356..a7233a6864dcd95f560372a2cd408b9e78604429 100644
--- a/packages/opendesign/src/badge/style/media.scss
+++ b/packages/opendesign/src/badge/style/media.scss
@@ -1,6 +1,6 @@
 @use '../../_styles/mixin.scss' as *;
 
-@include respond-to('<=pad') {
+@include respond-to('<=pad_v') {
   .o-badge {
     --badge-dot-size: 6px;
   }
diff --git a/packages/opendesign/src/badge/style/theme-ascend.scss b/packages/opendesign/src/badge/style/theme-ascend.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..1e206277843dfbc06da8fbadbcae3cf2de884daf 100644
--- a/packages/opendesign/src/badge/style/theme-ascend.scss
+++ b/packages/opendesign/src/badge/style/theme-ascend.scss
@@ -0,0 +1,3 @@
+.o-badge-primary {
+  --badge-bg-color: rgb(var(--o-red-huawei));
+}
diff --git a/packages/opendesign/src/badge/style/theme-kunpeng.scss b/packages/opendesign/src/badge/style/theme-kunpeng.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..1e206277843dfbc06da8fbadbcae3cf2de884daf 100644
--- a/packages/opendesign/src/badge/style/theme-kunpeng.scss
+++ b/packages/opendesign/src/badge/style/theme-kunpeng.scss
@@ -0,0 +1,3 @@
+.o-badge-primary {
+  --badge-bg-color: rgb(var(--o-red-huawei));
+}
diff --git a/packages/opendesign/src/badge/style/theme-openeuler.scss b/packages/opendesign/src/badge/style/theme-openeuler.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..da7faa4df3c51390b5871d69755b7fcf615b012a 100644
--- a/packages/opendesign/src/badge/style/theme-openeuler.scss
+++ b/packages/opendesign/src/badge/style/theme-openeuler.scss
@@ -0,0 +1,3 @@
+.o-badge-primary {
+  --badge-bg-color: var(--o-color-danger1);
+}