diff --git a/packages/opendesign/src/tag/OTag.vue b/packages/opendesign/src/tag/OTag.vue
index 2dea969d7d08c980e4b389b7107b327a174768af..9b9736ba0b5e98890f20bea496eca640091ee463 100644
--- a/packages/opendesign/src/tag/OTag.vue
+++ b/packages/opendesign/src/tag/OTag.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { ref, watch } from 'vue';
+import { computed, ref } from 'vue';
 import { getRoundClass } from '../_utils/style-class';
 import { tagProps } from './types';
 import { IconClose } from '../_utils/icons';
-import { isFunction, isUndefined } from '../_utils/is';
+import { isFunction } from '../_utils/is';
 
 const props = defineProps(tagProps);
 
@@ -14,31 +14,23 @@ const emits = defineEmits<{
 
 const round = getRoundClass(props, 'tag');
 
-const isVisible = ref(props.visible ?? props.defaultVisible);
-
-watch(
-  () => props.visible,
-  (val) => {
-    if (!isUndefined(val)) {
-      isVisible.value = val;
-    }
-  }
-);
+const innerIsVisible = ref(props.visible ?? props.defaultVisible);
+const isVisible = computed(() => props.visible ?? innerIsVisible.value);
 
 const onClose = async (ev: MouseEvent) => {
   ev.stopPropagation();
   if (isFunction(props.beforeClose)) {
     const rlt = await props.beforeClose();
     if (rlt) {
-      isVisible.value = false;
-      emits('update:visible', isVisible.value);
+      innerIsVisible.value = false;
+      emits('update:visible', innerIsVisible.value);
       emits('close', ev);
       return;
     }
   }
 
-  isVisible.value = false;
-  emits('update:visible', isVisible.value);
+  innerIsVisible.value = false;
+  emits('update:visible', innerIsVisible.value);
   emits('close', ev);
 };
 </script>
@@ -47,7 +39,7 @@ const onClose = async (ev: MouseEvent) => {
   <span
     v-if="isVisible"
     class="o-tag"
-    :class="[`o-tag-${props.variant}`, `o-tag-${props.color}`, `o-tag-${props.size}`, round.class.value]"
+    :class="[`o-tag-${props.variant}`, `o-tag-${props.color}`, `o-tag-${props.size}`, round.class.value, { 'o-tag-closable': props.closable }]"
     :style="round.style.value"
   >
     <span v-if="$slots.icon" class="o-tag-icon">
diff --git a/packages/opendesign/src/tag/__demo__/TagClosable.vue b/packages/opendesign/src/tag/__demo__/TagClosable.vue
index 167c4cf44cffb76b55dc70405523bbefa9a8b11d..3c94a8e397e4360ab08788a5759ec8f02ae42a38 100644
--- a/packages/opendesign/src/tag/__demo__/TagClosable.vue
+++ b/packages/opendesign/src/tag/__demo__/TagClosable.vue
@@ -1,8 +1,10 @@
 <script setup lang="ts">
+import { ref } from 'vue';
 import { OTag } from '../index';
 const handleClose = () => {
   console.log('close!!!');
 };
+const visible = ref(true);
 </script>
 
 <template>
@@ -19,5 +21,9 @@ const handleClose = () => {
     <OTag color="success" size="small" closable @close="handleClose">Tag3</OTag>
     <OTag color="warning" size="small" closable @close="handleClose">Tag4</OTag>
     <OTag color="danger" size="small" closable @close="handleClose">Tag5</OTag>
+
+    <OTag visible closable>controlled</OTag>
+    <button @click="visible = !visible">switch visible</button>
+    <OTag v-model:visible="visible" closable>controlled</OTag>
   </section>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagBasic.vue b/packages/opendesign/src/tag/__docs__/__case__/TagBasic.vue
index 95872a4bc9e0462180d2643080da97b96acda5eb..d744492c1d12b34bf0671798365808158b7bb5d6 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagBasic.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagBasic.vue
@@ -11,12 +11,12 @@ import { OTag, OIconAdd } from '@opensig/opendesign';
 </script>
 
 <template>
-  <section>
+  <div class="col">
     <OTag>Tag1</OTag>
     <OTag>Tag2</OTag>
     <OTag>
       <template #icon><OIconAdd /></template>
       Icon Tag
     </OTag>
-  </section>
+  </div>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagClosable.vue b/packages/opendesign/src/tag/__docs__/__case__/TagClosable.vue
index 4de8dc48447b1513aba6fc8c1e732b0b49349671..ddbf94d698b86d0b49918b006eb32e8e7de8dbf9 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagClosable.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagClosable.vue
@@ -14,17 +14,11 @@ const handleClose = () => {
 </script>
 
 <template>
-  <section>
+  <div class="col">
     <OTag closable @close="handleClose">Tag1</OTag>
     <OTag color="primary" closable @close="handleClose">Tag2</OTag>
     <OTag color="success" closable @close="handleClose">Tag3</OTag>
     <OTag color="warning" closable @close="handleClose">Tag4</OTag>
     <OTag color="danger" closable @close="handleClose">Tag5</OTag>
-
-    <OTag size="small" closable @close="handleClose">Tag1</OTag>
-    <OTag color="primary" size="small" closable @close="handleClose">Tag2</OTag>
-    <OTag color="success" size="small" closable @close="handleClose">Tag3</OTag>
-    <OTag color="warning" size="small" closable @close="handleClose">Tag4</OTag>
-    <OTag color="danger" size="small" closable @close="handleClose">Tag5</OTag>
-  </section>
+  </div>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagColor.vue b/packages/opendesign/src/tag/__docs__/__case__/TagColor.vue
index 3bc757b0d172ec78f30f3802f976c3ac8cf635cc..3b575f80d4fcd412c13eb3619c2da547ac4c348b 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagColor.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagColor.vue
@@ -11,11 +11,11 @@ import { OTag } from '@opensig/opendesign';
 </script>
 
 <template>
-  <section>
+  <div class="col">
     <OTag>Normal Tag</OTag>
     <OTag color="primary">Primary Tag</OTag>
     <OTag color="success">Success Tag</OTag>
     <OTag color="warning">Warning Tag</OTag>
     <OTag color="danger">Danger Tag</OTag>
-  </section>
+  </div>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagOutline.vue b/packages/opendesign/src/tag/__docs__/__case__/TagOutline.vue
index e831a178d150523a570795cd48790af646e2587d..536c673f394ec60d225a82451c05d0156c77f922 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagOutline.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagOutline.vue
@@ -11,7 +11,7 @@ import { OTag } from '@opensig/opendesign';
 </script>
 
 <template>
-  <section>
+  <div class="col">
     <OTag variant="outline">Tag1</OTag>
     <OTag color="primary" variant="outline">Tag2</OTag>
     <OTag color="success" variant="outline">Tag2</OTag>
@@ -23,5 +23,5 @@ import { OTag } from '@opensig/opendesign';
     <OTag color="success" closable variant="outline">Tag2</OTag>
     <OTag color="warning" closable variant="outline">Tag3</OTag>
     <OTag color="danger" closable variant="outline">Tag4</OTag>
-  </section>
+  </div>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagRound.vue b/packages/opendesign/src/tag/__docs__/__case__/TagRound.vue
index fb7b1543a2aae27f049b415dbc978e252092e5f9..2be62ce126e9099ba0ccb6a0da8d3142ba3271d7 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagRound.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagRound.vue
@@ -1,8 +1,10 @@
 <docs lang="md">
 <!--zh-CN-->
+
 ### Round
 
 <!--en-US-->
+
 ### Round
 </docs>
 
@@ -12,23 +14,15 @@ import { OTag } from '@opensig/opendesign';
 
 <template>
   <section>
-    <div>
-      <section>
-        <p>round="pill"</p>
-        <OTag round="pill" color="primary">Primary Tag</OTag>
-      </section>
-    </div>
-    <div>
-      <section>
-        <p>round="2px"</p>
-        <OTag round="2px" color="primary">Primary Tag</OTag>
-      </section>
-    </div>
-    <div>
-      <section>
-        <p>round="4px"</p>
-        <OTag round="4px" color="primary">Primary Tag</OTag>
-      </section>
-    </div>
+    <p>round="pill"</p>
+    <OTag round="pill" color="primary">Primary Tag</OTag>
+  </section>
+  <section>
+    <p>round="2px"</p>
+    <OTag round="2px" color="primary">Primary Tag</OTag>
+  </section>
+  <section>
+    <p>round="4px"</p>
+    <OTag round="4px" color="primary">Primary Tag</OTag>
   </section>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagSize.vue b/packages/opendesign/src/tag/__docs__/__case__/TagSize.vue
index d60c0509a2c1cea7aa2fd3e15ce145a24d843db0..a355978a7b2afa2317ffc8799fefc4830584397d 100644
--- a/packages/opendesign/src/tag/__docs__/__case__/TagSize.vue
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagSize.vue
@@ -11,8 +11,8 @@ import { OTag } from '@opensig/opendesign';
 </script>
 
 <template>
-  <section>
+  <div class="col">
     <OTag>Medium Tag</OTag>
     <OTag size="small">Small Tag</OTag>
-  </section>
+  </div>
 </template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/TagUsage.vue b/packages/opendesign/src/tag/__docs__/__case__/TagUsage.vue
new file mode 100644
index 0000000000000000000000000000000000000000..83a40252e70290cb95aba5e403c6620e494cc525
--- /dev/null
+++ b/packages/opendesign/src/tag/__docs__/__case__/TagUsage.vue
@@ -0,0 +1,46 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 使用
+
+<!-- en US -->
+
+## Usage
+</docs>
+<script setup lang="ts">
+import { propsToAttrStr } from '../../../_demo/utils';
+import { ColorTypes, TagVariantTypes, TagSizeTypes } from '@opensig/opendesign';
+import { DocDemoSchema, DocDemoTemplate } from '../../../_demo/types.ts';
+
+const _schema = {
+  color: {
+    type: 'list',
+    list: ColorTypes,
+  },
+  variant: {
+    type: 'list',
+    list: TagVariantTypes,
+  },
+  size: {
+    type: 'list',
+    list: TagSizeTypes,
+  },
+  round: {
+    type: 'string',
+    default: 'pill',
+  },
+  closable: {
+    type: 'boolean',
+    default: false,
+  },
+} satisfies Record<string, DocDemoSchema>;
+
+const _template: DocDemoTemplate<typeof _schema> = (_props) => `
+<OTag ${propsToAttrStr(_props)}>
+  <template #icon><OIconAdd /></template>
+  Icon Tag
+</OTag>
+`;
+
+const _ctx = {};
+</script>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/ThemeActivity.vue b/packages/opendesign/src/tag/__docs__/__case__/ThemeActivity.vue
new file mode 100644
index 0000000000000000000000000000000000000000..67b82d26108d1479a1f8268fb4a9f39f65f14f5f
--- /dev/null
+++ b/packages/opendesign/src/tag/__docs__/__case__/ThemeActivity.vue
@@ -0,0 +1,25 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 主题规范
+
+#### 运营标签
+
+<!-- en-US -->
+
+### Theme Specification
+
+#### Operation Tags
+</docs>
+<script setup lang="ts">
+import { OTag } from '@opensig/opendesign';
+</script>
+
+<template>
+  <div class="col">
+    <OTag color="primary" round="pill">NEW</OTag>
+    <OTag color="primary" round="pill">HOT</OTag>
+    <OTag color="primary" round="pill">推荐</OTag>
+    <OTag round="pill" class="c-tag-activity">运营标签</OTag>
+  </div>
+</template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/ThemeActivityEuler.vue b/packages/opendesign/src/tag/__docs__/__case__/ThemeActivityEuler.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c528621ec013aa0380ca198b7afbd1b363536241
--- /dev/null
+++ b/packages/opendesign/src/tag/__docs__/__case__/ThemeActivityEuler.vue
@@ -0,0 +1,24 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+### 主题规范
+
+#### 运营标签
+
+<!-- en-US -->
+
+### Theme Specification
+
+#### Operation Tags
+</docs>
+<script setup lang="ts">
+import { OTag } from '@opensig/opendesign';
+</script>
+
+<template>
+  <div class="col">
+    <OTag color="primary" round="pill">NEW</OTag>
+    <OTag color="primary" round="pill">HOT</OTag>
+    <OTag color="primary" round="pill">推荐</OTag>
+  </div>
+</template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/ThemeInfo.vue b/packages/opendesign/src/tag/__docs__/__case__/ThemeInfo.vue
new file mode 100644
index 0000000000000000000000000000000000000000..e189bc72191fd974d83cc6a2af4c58916a375ae1
--- /dev/null
+++ b/packages/opendesign/src/tag/__docs__/__case__/ThemeInfo.vue
@@ -0,0 +1,20 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+#### 信息标签
+
+<!-- en-US -->
+
+## Info Tags
+</docs>
+<script setup lang="ts">
+import { OTag } from '@opensig/opendesign';
+</script>
+
+<template>
+  <div class="col">
+    <OTag round="pill">Python</OTag>
+    <OTag round="pill">C++</OTag>
+    <OTag round="pill" class="c-tag-normal-inverse">Python</OTag>
+  </div>
+</template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/ThemeState.vue b/packages/opendesign/src/tag/__docs__/__case__/ThemeState.vue
new file mode 100644
index 0000000000000000000000000000000000000000..6d338b8207a16c9a6d14dc954ca39237650c10a3
--- /dev/null
+++ b/packages/opendesign/src/tag/__docs__/__case__/ThemeState.vue
@@ -0,0 +1,21 @@
+<docs lang="md">
+<!-- zh-CN -->
+
+#### 状态标签
+
+<!-- en-US -->
+
+#### State Tags
+</docs>
+<script setup lang="ts">
+import { OTag } from '@opensig/opendesign';
+</script>
+
+<template>
+  <div class="col">
+    <OTag round="pill" color="success">已完成</OTag>
+    <OTag round="pill" class="c-tag-unstart">未开始</OTag>
+    <OTag round="pill" class="c-tag-processing">处理中</OTag>
+    <OTag round="pill" color="danger">未通过</OTag>
+  </div>
+</template>
diff --git a/packages/opendesign/src/tag/__docs__/__case__/tagUsage.ts b/packages/opendesign/src/tag/__docs__/__case__/tagUsage.ts
deleted file mode 100644
index 0471179de7bf32056666092d076730763ac5abb0..0000000000000000000000000000000000000000
--- a/packages/opendesign/src/tag/__docs__/__case__/tagUsage.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-import { propsToAttrStr } from '../../../_demo/utils';
-import { ColorTypes, TagVariantTypes, TagSizeTypes } from '@opensig/opendesign';
-import { DocDemoSchema, DocDemoTemplate } from '../../../_demo/types.ts';
-
-export const docs = {
-  'zh-CN':
-    'Tag组件以紧凑的视觉形式清晰标识分类、状态、属性或关键词，帮助用户快速识别内容特征。可配置项包含：  \n' +
-    '- 标签颜色`color`  \n' +
-    '- 标签类型`variant`  \n' +
-    '- 标签尺寸`size`  \n' +
-    '- 圆角值`round`  \n' +
-    '- 是否可关闭`closable`  \n' +
-    '- 是否可见(双向绑定)`visible`  \n' +
-    '- 是否默认可见(非受控)`defaultVisible`  \n' +
-    '- 关闭前的钩子函数`beforeClose`  \n' +
-    '\n\n支持多色主题、自定义图标及可关闭交互，无缝融入筛选面板、数据表格、内容卡片等场景',
-  'en-US':
-    'The Tag component clearly identifies categories, statuses, attributes, or keywords in a compact visual form, helping users quickly identify content features. Configurable items include:  \n' +
-    '- Tag color `color`  ' +
-    '- Tag type `variant`  ' +
-    '- Tag size `size`  ' +
-    '- Border radius `round`  ' +
-    '- Whether closable `closable`  ' +
-    '- Visibility (two-way binding) `visible`  ' +
-    '- Default visibility (uncontrolled) `defaultVisible`  ' +
-    '- Hook function before closing `beforeClose`  ' +
-    '\n\nSupports multi-color themes, custom icons, and closable interactions, seamlessly integrating into scenarios such as filter panels, data tables, and content cards'
-};
-
-
-export const schema = {
-  color: {
-    type: 'list',
-    list: ColorTypes,
-  },
-  variant: {
-    type: 'list',
-    list: TagVariantTypes,
-  },
-  size: {
-    type: 'list',
-    list: TagSizeTypes,
-  },
-  round: {
-    type: 'string',
-    default: 'pill'
-  },
-  closable: {
-    type: 'boolean',
-    default: false,
-  },
-} satisfies Record<string, DocDemoSchema>;
-
-export const template: DocDemoTemplate<typeof schema> = (_props) => {
-  return `
-    <OTag ${propsToAttrStr(_props)}>Tag2</OTag>
-    <OTag ${propsToAttrStr(_props)}>
-      <template #icon><OIconAdd /></template>
-      Icon Tag
-    </OTag>
-  `;
-};
diff --git a/packages/opendesign/src/tag/__docs__/index.en-US.md b/packages/opendesign/src/tag/__docs__/index.en-US.md
index ff269687d0e9b9f5a27f1d85c07440107ec721b3..343619d5fe02691702f7b2f05bdccfd9561a5c57 100644
--- a/packages/opendesign/src/tag/__docs__/index.en-US.md
+++ b/packages/opendesign/src/tag/__docs__/index.en-US.md
@@ -3,13 +3,14 @@ sidebar: OTag
 kind: display
 ---
 
-# tag
+# Tag
 
 ## Usage
 
-<!-- @usage tagUsage -->
 
-## Cases
+<!-- @usage TagUsage -->
+
+## Demo
 
 <!-- @case TagBasic -->
 <!-- @case TagClosable -->
@@ -17,7 +18,11 @@ kind: display
 <!-- @case TagOutline -->
 <!-- @case TagRound -->
 <!-- @case TagSize -->
+<!-- @case:a|k ThemeActivity -->
+<!-- @case:e ThemeActivityEuler -->
+<!-- @case:a|k|e ThemeInfo -->
+<!-- @case:a|k|e ThemeState -->
 
-## Api
+## API
 
-<!-- @api OTag -->
\ No newline at end of file
+<!-- @api OTag -->
diff --git a/packages/opendesign/src/tag/__docs__/index.zh-CN.md b/packages/opendesign/src/tag/__docs__/index.zh-CN.md
index 99b6853b5cb5957cb6f786a43103119c9d769f2c..f679f93680d4d65ff1ad3e99e61416be96f8f698 100644
--- a/packages/opendesign/src/tag/__docs__/index.zh-CN.md
+++ b/packages/opendesign/src/tag/__docs__/index.zh-CN.md
@@ -7,7 +7,7 @@ kind: display
 
 ## 使用
 
-<!-- @usage tagUsage -->
+<!-- @usage TagUsage -->
 
 ## 示例
 
@@ -17,7 +17,11 @@ kind: display
 <!-- @case TagOutline -->
 <!-- @case TagRound -->
 <!-- @case TagSize -->
+<!-- @case:a|k ThemeActivity -->
+<!-- @case:e ThemeActivityEuler -->
+<!-- @case:a|k|e ThemeInfo -->
+<!-- @case:a|k|e ThemeState -->
 
-## Api
+## API
 
-<!-- @api OTag -->
\ No newline at end of file
+<!-- @api OTag -->
diff --git a/packages/opendesign/src/tag/style/media.scss b/packages/opendesign/src/tag/style/media.scss
index 72856697dc2eaefd99a54c99c6223ffd33d2ab8e..71efe3424a6955bb3b2c922fd15e2c0487755597 100644
--- a/packages/opendesign/src/tag/style/media.scss
+++ b/packages/opendesign/src/tag/style/media.scss
@@ -1,6 +1,6 @@
 @use '../../_styles/mixin.scss' as *;
 
-@include respond-to('<=pad') {
+@include respond-to('<=pad_v') {
   .o-tag-medium {
     --tag-padding: 0 6px;
     --tag-text-size: var(--o-font_size-tip2);
diff --git a/packages/opendesign/src/tag/style/theme-ak.scss b/packages/opendesign/src/tag/style/theme-ak.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e8deea124f399ba8007227933568f9ea8a3e71bf
--- /dev/null
+++ b/packages/opendesign/src/tag/style/theme-ak.scss
@@ -0,0 +1,24 @@
+.o-tag-normal {
+  --tag-color: var(--o-color-info1);
+  --tag-bg-color: var(--o-color-control3-light);
+  --tag-bd-color: var(--o-color-control3-light);
+
+  &.o-tag-outline {
+    --tag-bd-color: var(--o-color-control1);
+  }
+}
+.o-tag-primary {
+  --tag-bg-color: rgb(var(--o-red-huawei));
+  --tag-bd-color: rgb(var(--o-red-huawei));
+
+  &.o-tag-outline {
+    --tag-color: rgb(var(--o-red-huawei));
+  }
+}
+.c-tag-activity,
+.c-tag-ascend,
+.c-tag-kunpeng {
+  --tag-color: var(--o-color-white);
+  background: linear-gradient(90deg, rgb(var(--ak-color-band-start)) 0%, rgb(var(--ak-color-band-end)) 100%);
+  border: none;
+}
diff --git a/packages/opendesign/src/tag/style/theme-ascend.scss b/packages/opendesign/src/tag/style/theme-ascend.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..8d3c7489888dff5288bde9081521983f25d1687a 100644
--- a/packages/opendesign/src/tag/style/theme-ascend.scss
+++ b/packages/opendesign/src/tag/style/theme-ascend.scss
@@ -0,0 +1,2 @@
+@use './theme-common.scss' as *;
+@use './theme-ak.scss' as *;
diff --git a/packages/opendesign/src/tag/style/theme-common.scss b/packages/opendesign/src/tag/style/theme-common.scss
new file mode 100644
index 0000000000000000000000000000000000000000..933b775bd5be4e40d9033b48690db529fe72da97
--- /dev/null
+++ b/packages/opendesign/src/tag/style/theme-common.scss
@@ -0,0 +1,17 @@
+.o-tag-normal.c-tag-normal-inverse {
+  --tag-color: var(--o-color-white);
+  --tag-bg-color: rgba(var(--o-mixedgray-14, var(--o-gray-14)), 0.25);
+  --tag-bd-color: transparent;
+}
+
+.o-tag-normal.c-tag-unstart {
+  --tag-color: var(--o-color-white);
+  --tag-bg-color: rgba(var(--o-mixedgray-12, var(--o-gray-12)), 0.4);
+  --tag-bd-color: transparent;
+}
+
+.o-tag-normal.c-tag-processing {
+  --tag-color: var(--o-color-white);
+  --tag-bg-color: rgba(var(--o-blue-6));
+  --tag-bd-color: rgba(var(--o-blue-6));
+}
diff --git a/packages/opendesign/src/tag/style/theme-kunpeng.scss b/packages/opendesign/src/tag/style/theme-kunpeng.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..8d3c7489888dff5288bde9081521983f25d1687a 100644
--- a/packages/opendesign/src/tag/style/theme-kunpeng.scss
+++ b/packages/opendesign/src/tag/style/theme-kunpeng.scss
@@ -0,0 +1,2 @@
+@use './theme-common.scss' as *;
+@use './theme-ak.scss' as *;
diff --git a/packages/opendesign/src/tag/style/theme-openeuler.scss b/packages/opendesign/src/tag/style/theme-openeuler.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..92db6d2ace22efc76237f2d232760f1330007243 100644
--- a/packages/opendesign/src/tag/style/theme-openeuler.scss
+++ b/packages/opendesign/src/tag/style/theme-openeuler.scss
@@ -0,0 +1,38 @@
+@use '../../_styles/mixin.scss' as *;
+@use './theme-common.scss' as *;
+
+.o-tag-normal {
+  --tag-color: var(--o-color-info1);
+  --tag-bg-color: var(--o-color-control4-light);
+  --tag-bd-color: var(--o-color-control4-light);
+
+  &.o-tag-outline {
+    --tag-bd-color: var(--o-color-control1);
+  }
+}
+.o-tag-primary {
+  --tag-bg-color: var(--o-color-danger1);
+  --tag-bd-color: var(--o-color-danger1);
+
+  &.o-tag-outline {
+    --tag-color: var(--o-color-danger1);
+  }
+}
+.o-tag-closable.o-tag-normal {
+  --tag-bg-color: var(--o-color-control2-light);
+  --tag-bd-color: var(--o-color-control2-light);
+
+  @include hover {
+    --tag-bg-color: var(--o-color-control3-light);
+    --tag-bd-color: var(--o-color-control3-light);
+  }
+
+  &.o-tag-outline {
+    --tag-bg-color: var(--o-color-control2);
+    --tag-bd-color: var(--o-color-control2);
+    --tag-bg-color: transparent;
+
+    --tag-icon-close-color-hover: var(--o-color-control3);
+    --tag-icon-close-color-active: var(--o-color-control3);
+  }
+}
diff --git a/packages/opendesign/src/tag/types.ts b/packages/opendesign/src/tag/types.ts
index 1606f8c41a288e8de68cfb4363b48db3720c9f48..7146cab5d3749c16a26bb512dca0e0aa9c814368 100644
--- a/packages/opendesign/src/tag/types.ts
+++ b/packages/opendesign/src/tag/types.ts
@@ -12,55 +12,68 @@ export type TagSizeT = (typeof TagSizeTypes)[number];
 
 export const tagProps = {
   /**
-   * 标签颜色 ColorT
+   * @zh-CN 标签颜色
+   * @en-US Tag color
+   * @default 'normal'
    */
   color: {
     type: String as PropType<ColorT>,
     default: 'normal',
   },
   /**
-   * 标签类型 TagVariantT
+   * @zh-CN 标签类型
+   * @en-US Tag variant
+   * @default 'solid'
    */
   variant: {
     type: String as PropType<TagVariantT>,
     default: 'solid',
   },
   /**
-   * 标签尺寸 TagSizeT
+   * @zh-CN 标签尺寸
+   * @en-US Tag size
+   * @default 'medium'
    */
   size: {
     type: String as PropType<TagSizeT>,
     default: 'medium',
   },
   /**
-   * 圆角值 RoundT
+   * @zh-CN 标签圆角
+   * @en-US Tag round
    */
   round: {
     type: String as PropType<RoundT>,
   },
   /**
-   * 是否可关闭
+   * @zh-CN 是否可关闭
+   * @en-US Whether closable
+   * @default false
    */
   closable: {
     type: Boolean,
     default: false,
   },
   /**
-   * tag是否可见 v-model
+   * @zh-CN 是否可见 (双向绑定)
+   * @en-US Whether visible (two-way binding)
    */
   visible: {
     type: Boolean,
     default: undefined,
   },
   /**
-   * 非受控模式，tag是否默认可见
+   * @zh-CN 非受控模式，是否默认可见
+   * @en-US Uncontrolled mode, whether visible by default
+   * @default true
    */
   defaultVisible: {
     type: Boolean,
     default: true,
   },
   /**
-   * 关闭前的钩子函数
+   * @zh-CN 关闭前的钩子函数
+   * @en-US Hook function before closing
    */
   beforeClose: {
     type: Function as PropType<() => Promise<boolean> | boolean>,