diff --git a/examples/sites/demos/apis/radio.js b/examples/sites/demos/apis/radio.js
index b29c8afcf..34d01441e 100644
--- a/examples/sites/demos/apis/radio.js
+++ b/examples/sites/demos/apis/radio.js
@@ -5,18 +5,6 @@ export default {
       name: 'radio',
       type: 'component',
       props: [
-        {
-          name: 'border',
-          type: 'boolean',
-          defaultValue: 'false',
-          desc: {
-            'zh-CN': '是否显示边框',
-            'en-US': 'Display Border'
-          },
-          mode: ['pc', 'mobile-first'],
-          pcDemo: 'with-border',
-          mfDemo: ''
-        },
         {
           name: 'disabled',
           type: 'boolean',
@@ -79,18 +67,6 @@ export default {
           mobileDemo: 'base',
           mfDemo: ''
         },
-        {
-          name: 'size',
-          type: "'medium' | small' | 'mini'",
-          defaultValue: '',
-          desc: {
-            'zh-CN': 'radio 的尺寸，仅在 border 为真时有效',
-            'en-US': 'radio size. This parameter is valid only when border is set to true'
-          },
-          mode: ['pc', 'mobile-first'],
-          pcDemo: 'radio-size',
-          mfDemo: ''
-        },
         {
           name: 'tabindex',
           type: 'String',
diff --git a/examples/sites/demos/pc/app/radio/radio-size-composition-api.vue b/examples/sites/demos/pc/app/radio/radio-size-composition-api.vue
index 98439ce04..008e118f9 100644
--- a/examples/sites/demos/pc/app/radio/radio-size-composition-api.vue
+++ b/examples/sites/demos/pc/app/radio/radio-size-composition-api.vue
@@ -19,32 +19,12 @@
         <tiny-radio-button label="2">选项二</tiny-radio-button>
       </tiny-radio-group>
     </div>
-
-    <div class="title mt-20">带边框尺寸：</div>
-    <tiny-radio-group v-model="value" size="medium">
-      <tiny-radio label="1" border>选项一</tiny-radio>
-      <tiny-radio label="2" border>选项二</tiny-radio>
-    </tiny-radio-group>
-
-    <div class="mt-20">
-      <tiny-radio-group v-model="value" size="small">
-        <tiny-radio label="1" border>选项一</tiny-radio>
-        <tiny-radio label="2" border>选项二</tiny-radio>
-      </tiny-radio-group>
-    </div>
-
-    <div class="mt-20">
-      <tiny-radio-group v-model="value" size="mini">
-        <tiny-radio label="1" border>选项一</tiny-radio>
-        <tiny-radio label="2" border>选项二</tiny-radio>
-      </tiny-radio-group>
-    </div>
   </div>
 </template>
 
 <script setup>
 import { ref } from 'vue'
-import { Radio as TinyRadio, RadioButton as TinyRadioButton, RadioGroup as TinyRadioGroup } from '@opentiny/vue'
+import { RadioButton as TinyRadioButton, RadioGroup as TinyRadioGroup } from '@opentiny/vue'
 
 const value = ref('1')
 </script>
diff --git a/examples/sites/demos/pc/app/radio/radio-size.spec.ts b/examples/sites/demos/pc/app/radio/radio-size.spec.ts
index ec3d72b60..267d1321d 100644
--- a/examples/sites/demos/pc/app/radio/radio-size.spec.ts
+++ b/examples/sites/demos/pc/app/radio/radio-size.spec.ts
@@ -7,10 +7,7 @@ test('尺寸设置', async ({ page }) => {
   const demo = page.locator('#radio-size')
   const radioGroup = demo.locator('.tiny-radio-group')
 
-  await expect(radioGroup.first()).toHaveCSS('width', '184px')
   await expect(radioGroup.first()).toHaveCSS('height', '32px')
-  await expect(radioGroup.nth(1)).toHaveCSS('width', '184px')
   await expect(radioGroup.nth(1)).toHaveCSS('height', '28px')
-  await expect(radioGroup.nth(2)).toHaveCSS('width', '152px')
   await expect(radioGroup.nth(2)).toHaveCSS('height', '24px')
 })
diff --git a/examples/sites/demos/pc/app/radio/radio-size.vue b/examples/sites/demos/pc/app/radio/radio-size.vue
index b70b31aeb..1cb3efc0d 100644
--- a/examples/sites/demos/pc/app/radio/radio-size.vue
+++ b/examples/sites/demos/pc/app/radio/radio-size.vue
@@ -19,35 +19,14 @@
         <tiny-radio-button label="2">选项二</tiny-radio-button>
       </tiny-radio-group>
     </div>
-
-    <div class="title mt-20">带边框尺寸：</div>
-    <tiny-radio-group v-model="value" size="medium">
-      <tiny-radio label="1" border>选项一</tiny-radio>
-      <tiny-radio label="2" border>选项二</tiny-radio>
-    </tiny-radio-group>
-
-    <div class="mt-20">
-      <tiny-radio-group v-model="value" size="small">
-        <tiny-radio label="1" border>选项一</tiny-radio>
-        <tiny-radio label="2" border>选项二</tiny-radio>
-      </tiny-radio-group>
-    </div>
-
-    <div class="mt-20">
-      <tiny-radio-group v-model="value" size="mini">
-        <tiny-radio label="1" border>选项一</tiny-radio>
-        <tiny-radio label="2" border>选项二</tiny-radio>
-      </tiny-radio-group>
-    </div>
   </div>
 </template>
 
 <script>
-import { Radio, RadioButton, RadioGroup } from '@opentiny/vue'
+import { RadioButton, RadioGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyRadio: Radio,
     TinyRadioButton: RadioButton,
     TinyRadioGroup: RadioGroup
   },
diff --git a/examples/sites/demos/pc/app/radio/webdoc/radio.js b/examples/sites/demos/pc/app/radio/webdoc/radio.js
index 12fb0ed54..a0a166f20 100644
--- a/examples/sites/demos/pc/app/radio/webdoc/radio.js
+++ b/examples/sites/demos/pc/app/radio/webdoc/radio.js
@@ -42,18 +42,6 @@ export default {
       },
       codeFiles: ['group-options.vue']
     },
-    {
-      demoId: 'with-border',
-      name: {
-        'zh-CN': '带有边框',
-        'en-US': 'With borders'
-      },
-      desc: {
-        'zh-CN': '<p>可通过设置 <code>border</code> 属性，给单选框增加边框。</p>\n',
-        'en-US': '<p>You can set the <code>border</code> attribute to add a border to an option button. </p>\n'
-      },
-      codeFiles: ['with-border.vue']
-    },
     {
       demoId: 'dynamic-disable',
       name: {
@@ -116,7 +104,7 @@ export default {
       },
       desc: {
         'zh-CN':
-          '<p>可对按钮形式的 <code>radio</code> 或带有边框的 <code>radio</code> 设置 <code>size</code> 属性，以改变其尺寸，可选值有： <code>medium</code>  、<code>small</code>  、<code>mini</code> 。</p>\n',
+          '<p>可对按钮形式的 <code>radio</code> 设置 <code>size</code> 属性，以改变其尺寸，可选值有： <code>medium</code>  、<code>small</code>  、<code>mini</code> 。</p>',
         'en-US':
           '<p>You can set the <code>size</code> attribute for a radio with a button or a radio with a border to change its size. The options include medium, small, and mini. </p>\n'
       },
diff --git a/examples/sites/demos/pc/app/radio/with-border-composition-api.vue b/examples/sites/demos/pc/app/radio/with-border-composition-api.vue
deleted file mode 100644
index 44ae910ef..000000000
--- a/examples/sites/demos/pc/app/radio/with-border-composition-api.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-  <div>
-    <tiny-radio border v-model="value" label="1">日度</tiny-radio>
-    <tiny-radio border v-model="value" label="2">月度</tiny-radio>
-    <tiny-radio border v-model="value" label="3">年度</tiny-radio>
-  </div>
-</template>
-
-<script setup>
-import { ref } from 'vue'
-import { Radio as TinyRadio } from '@opentiny/vue'
-
-const value = ref('1')
-</script>
diff --git a/examples/sites/demos/pc/app/radio/with-border.spec.ts b/examples/sites/demos/pc/app/radio/with-border.spec.ts
deleted file mode 100644
index f6954e8c7..000000000
--- a/examples/sites/demos/pc/app/radio/with-border.spec.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-test('带有边框', async ({ page }) => {
-  page.on('pageerror', (exception) => expect(exception).toBeNull())
-  await page.goto('radio#with-border')
-  const bordered1 = page.locator('.is-bordered').nth(0)
-  const bordered2 = page.locator('.is-bordered').nth(1)
-  const bordered3 = page.locator('.is-bordered').nth(2)
-  await expect(bordered1).toBeVisible()
-  await expect(bordered2).toBeVisible()
-  await expect(bordered3).toBeVisible()
-})
diff --git a/examples/sites/demos/pc/app/radio/with-border.vue b/examples/sites/demos/pc/app/radio/with-border.vue
deleted file mode 100644
index 9b1a22bf9..000000000
--- a/examples/sites/demos/pc/app/radio/with-border.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<template>
-  <div>
-    <tiny-radio border v-model="value" label="1">日度</tiny-radio>
-    <tiny-radio border v-model="value" label="2">月度</tiny-radio>
-    <tiny-radio border v-model="value" label="3">年度</tiny-radio>
-  </div>
-</template>
-
-<script>
-import { Radio } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyRadio: Radio
-  },
-  data() {
-    return {
-      value: '1'
-    }
-  }
-}
-</script>
diff --git a/packages/theme/src/radio-button/index.less b/packages/theme/src/radio-button/index.less
index 27436e626..6804a7ba2 100644
--- a/packages/theme/src/radio-button/index.less
+++ b/packages/theme/src/radio-button/index.less
@@ -16,41 +16,25 @@
 @radio-button-prefix-cls: ~'@{css-prefix}radio-button';
 
 .@{radio-button-prefix-cls} {
-  .component-css-vars-radio-button();
-
-  border-radius: var(--ti-radio-button-border-radius);
-  &:first-child &__inner {
-    border-radius: var(--ti-radio-button-child-left-border-radius) var(--ti-radio-button-child-right-border-radius) var(--ti-radio-button-child-right-border-radius) var(--ti-radio-button-child-left-border-radius);
-  }
-
-  &:first-child &__orig-radio:checked + &__inner {
-    box-shadow: none;
-  }
-
-  &:last-child &__inner {
-    border-radius: var(--ti-radio-button-child-right-border-radius) var(--ti-radio-button-child-left-border-radius) var(--ti-radio-button-child-left-border-radius) var(--ti-radio-button-child-right-border-radius);
-  }
-
-  &:first-child:last-child &__inner {
-    border-radius: var(--ti-radio-button-border-radius);
-  }
+  .inject-RadioButton-vars();
+  border-radius: var(--tv-RadioButton-border-radius);
 
   &,
   &__inner {
     display: inline-block;
     position: relative;
     outline: 0;
-    margin-right: var(--ti-radio-button-margin-right);
+    margin-right: 2px;
   }
 
   &__inner {
-    color: var(--ti-radio-button-text-color);
-    font-size: var(--ti-radio-button-font-size);
-    background: var(--ti-radio-button-bg-color);
-    border: 1px solid var(--ti-radio-button-border-color);
-    padding: var(--ti-radio-button-padding-verticals) 24px;
+    color: var(--tv-RadioButton-text-color);
+    font-size: var(--tv-RadioButton-font-size);
+    background: var(--tv-RadioButton-bg-color);
+    border: 1px solid var(--tv-RadioButton-border-color);
+    padding: 5px 24px;
     font-weight: 500;
-    border-radius: var(--ti-radio-button-border-radius);
+    border-radius: var(--tv-RadioButton-border-radius);
     line-height: 1;
     white-space: nowrap;
     vertical-align: middle;
@@ -66,8 +50,7 @@
     }
 
     &:hover {
-      color: var(--ti-radio-button-hover-text-color);
-      background-color: var(--ti-radio-button-checked-hover-bg-color);
+      background-color: var(--tv-RadioButton-checked-hover-bg-color);
       outline: 0;
     }
 
@@ -89,21 +72,15 @@
     &:checked {
       & + .@{radio-button-prefix-cls}__inner {
         color: #fff;
-        background-color: var(--ti-radio-button-checked-normal-bg-color);
-        box-shadow: var(--ti-radio-button-checked-normal-box-shadow);
-
-        &:hover {
-          background-color: var(--ti-radio-button-checked-hover-bg-color);
-          box-shadow: var(--ti-radio-button-checked-hover-box-shadow);
-        }
+        background-color: var(--tv-RadioButton-checked-bg-color);
       }
     }
 
     &:disabled {
       & + .@{radio-button-prefix-cls}__inner {
-        color: var(--ti-radio-button-disabled-text-color);
-        border-color: var(--ti-radio-button-border-color);
-        background-color: var(--ti-radio-button-disabled-bg-color);
+        color: var(--tv-RadioButton-disabled-text-color);
+        border-color: var(--tv-RadioButton-border-color);
+        background-color: var(--tv-RadioButton-disabled-bg-color);
         background-image: none;
         box-shadow: none;
         cursor: not-allowed;
@@ -112,19 +89,17 @@
 
     &:disabled:checked {
       & + .@{radio-button-prefix-cls}__inner {
-        background-color: var(--ti-radio-button-checked-disabled-bg-color);
-        color: var(--ti-radio-button-disabled-checked-text-color);
+        background-color: var(--tv-RadioButton-checked-disabled-bg-color);
+        color: var(--tv-RadioButton-disabled-checked-text-color);
       }
     }
   }
 
   &--default &__inner {
-    font-size: var(--ti-radio-button-medium-font-size);
     display: flex;
     align-items: center;
-    height: 32px;
+    height: var(--tv-RadioButton-size-height-md);
     padding: 5px 24px;
-    border-radius: var(--ti-radio-button-margin-right);
 
     &.is-round {
       padding: 10px 20px;
@@ -132,12 +107,10 @@
   }
 
   &--medium &__inner {
-    font-size: var(--ti-radio-button-medium-font-size);
     display: flex;
     align-items: center;
-    height: 32px;
+    height: var(--tv-RadioButton-size-height-md);
     padding: 5px 24px;
-    border-radius: var(--ti-radio-button-margin-right);
 
     &.is-round {
       padding: 10px 20px;
@@ -145,12 +118,11 @@
   }
 
   &--small &__inner {
-    font-size: var(--ti-radio-button-font-size);
+    font-size: 12px;
     display: flex;
     align-items: center;
-    height: 28px;
+    height: var(--tv-RadioButton-size-height-sm);
     padding: 5px 24px;
-    border-radius: var(--ti-radio-button-margin-right);
 
     &.is-round {
       padding: 9px 15px;
@@ -158,24 +130,20 @@
   }
 
   &--mini &__inner {
-    font-size: var(--ti-radio-button-font-size);
+    font-size: 12px;
     display: flex;
     align-items: center;
-    height: 24px;
+    height: var(--tv-RadioButton-size-height-xs);
     padding: 3px 16px;
-    border-radius: var(--ti-radio-button-margin-right);
+    border-radius: 4px;
 
     &.is-round {
       padding: 7px 15px;
     }
   }
 
-  &:focus:not(.is-focus):not(:active):not(.is-disabled) {
-    box-shadow: 0 0 2px 2px var(--ti-radio-bordered-hover-border-color);
-  }
   &.is-active.is-disabled {
-    color: var(--ti-radio-button-active-disabled-color);
-    background-color: var(--ti-radio-button-active-disabled-bg-color);;
-
+    color: var(--tv-RadioButton-disabled-checked-text-color);
+    background-color: var(--tv-RadioButton-checked-disabled-bg-color);
   }
 }
diff --git a/packages/theme/src/radio-button/vars.less b/packages/theme/src/radio-button/vars.less
index fa7ef4d70..acdc0f2c6 100644
--- a/packages/theme/src/radio-button/vars.less
+++ b/packages/theme/src/radio-button/vars.less
@@ -10,26 +10,31 @@
 *
 */
 
-.component-css-vars-radio-button() {
-  --ti-radio-button-text-color: var(--ti-common-color-text-secondary);
-  --ti-radio-button-hover-text-color: var(--ti-common-color-bg-emphasize);
-  --ti-radio-button-border-radius: var(--ti-common-space-6);
-  --ti-radio-button-font-size: var(--ti-common-font-size-base, 12px);
-  --ti-radio-button-bg-color: var(--ti-common-color-bg-normal);
-  --ti-radio-button-checked-normal-bg-color: #1476FF;
-  --ti-radio-button-checked-normal-box-shadow: #1476FF;
-  --ti-radio-button-checked-hover-bg-color: var(--ti-common-color-prompt-bg);
-  --ti-radio-button-checked-hover-box-shadow: #1293ff;
-  --ti-radio-button-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8);
-  --ti-radio-button-disabled-checked-text-color: var(--ti-common-color-text-weaken);
-  --ti-radio-button-disabled-bg-color: var(--ti-common-color-bg-disabled);
-  --ti-radio-button-medium-font-size: var(--ti-common-font-size-1, 14px);
-  --ti-radio-button-margin-right: var(--ti-common-space-2);
-  --ti-radio-button-border-left: 0;
-  --ti-radio-button-child-left-border-radius: var(--ti-common-space-6);
-  --ti-radio-button-child-right-border-radius: var(--ti-common-space-6);
-  --ti-radio-button-padding-verticals: 5px;
-  --ti-radio-button-active-disabled-color: var(--ti-common-color-text-weaken);
-  --ti-radio-button-active-disabled-bg-color: var(--ti-common-color-bg-dark-disabled);
-  --ti-radio-button-checked-disabled-bg-color: var(--ti-common-color-bg-dark-disabled);
+.inject-RadioButton-vars() {
+  // 单选框按钮文本色
+  --tv-RadioButton-text-color: var(--tv-color-text);
+  // 单选框按钮圆角
+  --tv-RadioButton-border-radius: var(--tv-border-radius-md);
+  // 单选框按钮字体大小
+  --tv-RadioButton-font-size: var(--tv-font-size-md);
+  // 单选框按钮背景色
+  --tv-RadioButton-bg-color: var(--tv-color-bg);
+  // 单选框按钮选中背景色
+  --tv-RadioButton-checked-bg-color: var(--tv-color-bg-active-control);
+  // 单选框按钮悬浮背景色
+  --tv-RadioButton-checked-hover-bg-color: var(--tv-color-bg-hover-1);
+  // 单选框按钮禁用文本色
+  --tv-RadioButton-disabled-text-color: var(--tv-color-text-disabled);
+  // 单选框按钮选中状态禁用文本色
+  --tv-RadioButton-disabled-checked-text-color: var(--tv-color-text-weaken);
+  // 单选框按钮禁用背景色
+  --tv-RadioButton-disabled-bg-color: var(--tv-color-bg-disabled);
+  // 单选框按钮选中状态禁用背景色
+  --tv-RadioButton-checked-disabled-bg-color: var(--tv-color-bg-disabled-control-checked);
+  // 单选框按钮中等尺寸
+  --tv-RadioButton-size-height-md: var(--tv-size-height-md);
+  // 单选框按钮小型尺寸
+  --tv-RadioButton-size-height-sm: var(--tv-size-height-sm);
+  // 单选框按钮超小尺寸
+  --tv-RadioButton-size-height-xs: var(--tv-size-height-xs);
 }
diff --git a/packages/theme/src/radio-group/index.less b/packages/theme/src/radio-group/index.less
index 563d4d750..2484a18ce 100644
--- a/packages/theme/src/radio-group/index.less
+++ b/packages/theme/src/radio-group/index.less
@@ -19,7 +19,7 @@
 @radio-prefix-cls: ~'@{css-prefix}radio';
 
 .@{radio-group-prefix-cls} {
-  .component-css-vars-radio-group();
+  .inject-RadioGroup-vars();
 
   display: inline-flex;
 
@@ -31,31 +31,13 @@
       margin-right: 0;
 
       &:not(:last-child) {
-        margin-bottom: var(--ti-radio-group-margin-bottom);
+        margin-bottom: var(--tv-RadioGroup-margin-bottom);
       }
     }
 
     .@{radio-button-prefix-cls} {
       display: block;
-      margin-bottom: var(--ti-radio-button-margin-bottom);
-      border-radius: var(--ti-radio-button-border-radius);
-
-      &:first-child .@{radio-button-prefix-cls}__inner {
-        border-radius: var(--ti-radio-button-top-border-radius) var(--ti-radio-button-top-border-radius) var(--ti-radio-button-bottom-border-radius) var(--ti-radio-button-bottom-border-radius);
-      }
-
-      &:last-child .@{radio-button-prefix-cls}__inner {
-        border-radius: var(--ti-radio-button-bottom-border-radius) var(--ti-radio-button-bottom-border-radius) var(--ti-radio-button-top-border-radius) var(--ti-radio-button-top-border-radius);
-      }
-
-      &.is-active .@{radio-button-prefix-cls}__inner {
-        box-shadow: none;
-        border-color: var(--ti-radio-button-checked-normal-border-color);
-      }
-
-      &.is-active.is-disabled .@{radio-button-prefix-cls}__inner {
-        border-color: var(--ti-radio-input-checked-disabled-border-color);
-      }
+      margin-bottom: var(--tv-RadioGroup-button-margin-bottom);
     }
   }
 }
diff --git a/packages/theme/src/radio-group/vars.less b/packages/theme/src/radio-group/vars.less
index e732bd4d4..593d7b271 100644
--- a/packages/theme/src/radio-group/vars.less
+++ b/packages/theme/src/radio-group/vars.less
@@ -9,10 +9,8 @@
 * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
 *
 */
-.component-css-vars-radio-group() {
-  --ti-radio-group-margin-bottom: 16px;
-  --ti-radio-button-border-radius: 6px;
-  --ti-radio-button-margin-bottom: 2px;
-  --ti-radio-button-top-border-radius: 6px;
-  --ti-radio-button-bottom-border-radius: 6px;
-}
\ No newline at end of file
+
+.inject-RadioGroup-vars() {
+  --tv-RadioGroup-margin-bottom: 16px;
+  --tv-RadioGroup-button-margin-bottom: 2px;
+}
diff --git a/packages/theme/src/radio/index.less b/packages/theme/src/radio/index.less
index f15f20f1f..068c7006f 100644
--- a/packages/theme/src/radio/index.less
+++ b/packages/theme/src/radio/index.less
@@ -17,11 +17,10 @@
 @radio-prefix-cls: ~'@{css-prefix}radio';
 
 .@{radio-prefix-cls} {
-  .component-css-vars-radio();
+  .inject-radio-vars();
 
-  color: var(--ti-radio-text-color);
-  font-weight: 500;
-  margin-right: var(--ti-radio-margin-right);
+  color: var(--tv-Radio-text-color);
+  margin-right: var(--tv-Radio-margin-right);
   display: inline-flex;
   align-items: center;
   position: relative;
@@ -33,66 +32,50 @@
   }
 
   &.is-bordered {
-    padding: var(--ti-radio-mini-bordered-padding-vertical) var(--ti-radio-mini-bordered-padding-horizontal);
-    border-radius: var(--ti-radio-bordered-border-radius);
-    border: 1px solid var(--ti-radio-bordered-border-color);
+    padding: 0 8px;
+    border-radius: var(--tv-Radio-bordered-border-radius);
+    border: 1px solid var(--tv-Radio-bordered-border-color);
     box-sizing: border-box;
-    height: var(--ti-radio-bordered-height);
+    height: 32px;
 
     & + & {
-      margin-left: var(--ti-radio-mini-bordered-margin-left);
+      margin-left: 8px;
     }
 
     &.is-checked {
-      border-color: var(--ti-radio-bordered-checked-border-color);
+      border-color: var(--tv-Radio-bordered-checked-border-color);
     }
 
     &.is-disabled {
       cursor: not-allowed;
-      border-color: var(--ti-radio-bordered-border-color);
+      border-color: var(--tv-Radio-bordered-border-color);
     }
   }
 
   &,
   &__input {
     white-space: nowrap;
-    line-height: 1;
     outline: 0;
   }
 
   &__input {
     cursor: pointer;
-    line-height: 1;
     display: inline-flex;
-    display: inline-block\9;
-
-    // 兼容ie10-ie11
-    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-      display: inline-block;
-    }
-
-    // 兼容edge
-    @supports (-ms-ime-align: auto) {
-      display: inline-block;
-    }
 
     &.is-checked {
       .@{radio-prefix-cls}__inner {
-        border-color: var(--ti-radio-bordered-checked-border-color);
-        background: var(--ti-radio-bordered-checked-background-color);
+        border-color: var(--tv-Radio-bordered-checked-border-color);
 
-        &::after {
+        &:after {
           transform: translate(-50%, -50%) scale(1);
-          background-color: var(--ti-radio-inner-checked-bg-color);
+          background-color: var(--tv-Radio-inner-checked-bg-color);
         }
       }
-      &:hover .@{radio-prefix-cls}__inner::after {
-        background-color: var(--ti-radio-inner-checked-hover-bg-color);
-      }
+
       &:not(.is-disabled) {
         .@{radio-prefix-cls}__inner {
           &:hover {
-            border-color: var(--ti-radio-bordered-checked-hover-border-color);
+            border-color: var(--tv-Radio-bordered-checked-hover-border-color);
           }
         }
       }
@@ -100,12 +83,12 @@
 
     &.is-disabled {
       .@{radio-prefix-cls}__inner {
-        border-color: var(--ti-radio-input-disabled-border-color);
+        border-color: var(--tv-Radio-input-disabled-border-color);
 
         &,
-        &::after {
+        &:after {
           cursor: not-allowed;
-          background-color: var(--ti-radio-input-disabled-bg-color);
+          background-color: var(--tv-Radio-input-disabled-bg-color);
         }
 
         & + .@{radio-prefix-cls}__label {
@@ -114,27 +97,27 @@
       }
 
       &.is-checked .@{radio-prefix-cls}__inner {
-        background-color: var(--ti-radio-input-checked-disabled-bg-color);
-        border-color: var(--ti-radio-input-checked-disabled-border-color);
+        background-color: var(--tv-Radio-input-checked-disabled-bg-color);
+        border-color: var(--tv-Radio-input-checked-disabled-border-color);
 
-        &::after {
-          background-color: var(--ti-radio-inner-checked-disabled-bg-color);
+        &:after {
+          background-color: var(--tv-Radio-inner-checked-disabled-bg-color);
         }
       }
 
       & + span.@{radio-prefix-cls}__label {
-        color: var(--ti-radio-input-disabled-text-color);
+        color: var(--tv-Radio-input-disabled-text-color);
         cursor: not-allowed;
       }
     }
   }
 
   &__inner {
-    border: 1px solid var(--ti-radio-bordered-border-color);
+    border: 1px solid var(--tv-Radio-bordered-border-color);
     border-radius: 100%;
-    width: var(--ti-radio-inner-width);
-    height: var(--ti-radio-inner-height);
-    background-color: var(--ti-radio-inner-bg-color);
+    width: var(--tv-Radio-inner-width);
+    height: var(--tv-Radio-inner-height);
+    background-color: var(--tv-Radio-inner-bg-color);
     position: relative;
     display: inline-block;
     cursor: pointer;
@@ -142,18 +125,18 @@
     outline: none;
 
     &:hover {
-      border-color: var(--ti-radio-bordered-hover-border-color);
+      border-color: var(--tv-Radio-bordered-hover-border-color);
     }
 
     &:active {
-      border-color: var(--ti-radio-bordered-active-border-color);
+      border-color: var(--tv-Radio-bordered-active-border-color);
     }
 
-    &::after {
-      width: var(--ti-radio-inner-size);
-      height: var(--ti-radio-inner-size);
-      border-radius: var(--ti-radio-inner-border-radius);
-      background-color: var(--ti-radio-inner-bg-color);
+    &:after {
+      width: var(--tv-Radio-inner-size);
+      height: var(--tv-Radio-inner-size);
+      border-radius: var(--tv-Radio-inner-border-radius);
+      background-color: var(--tv-Radio-inner-bg-color);
       content: '';
       position: absolute;
       left: 50%;
@@ -174,65 +157,11 @@
   }
 
   &__label {
-    font-size: var(--ti-radio-font-size);
+    font-size: var(--tv-Radio-font-size);
     padding-left: 8px;
     vertical-align: middle;
   }
 
-  &--medium {
-    &.is-bordered {
-      border-radius: var(--ti-radio-bordered-border-radius);
-      height: var(--ti-radio-medium-height);
-
-      .@{radio-prefix-cls}__inner {
-        height: var(--ti-radio-medium-inner-height);
-        width: var(--ti-radio-medium-inner-width);
-      }
-
-      .@{radio-prefix-cls}__label {
-        font-size: var(--ti-radio-font-size);
-      }
-    }
-  }
-
-  &--small {
-    &.is-bordered {
-      border-radius: var(--ti-radio-bordered-border-radius);
-      height: var(--ti-radio-small-height);
-
-      .@{radio-prefix-cls}__inner {
-        height: var(--ti-radio-small-inner-height);
-        width: var(--ti-radio-small-inner-width);
-      }
-
-      .@{radio-prefix-cls}__label {
-        font-size: var(--ti-radio-font-size);
-      }
-    }
-  }
-
-  &--mini {
-    &.is-bordered {
-      padding: var(--ti-radio-mini-bordered-padding-vertical) var(--ti-radio-mini-bordered-padding-horizontal);
-      border-radius: var(--ti-radio-bordered-border-radius, 2px);
-      height: var(--ti-radio-mini-height);
-      line-height: calc(var(--ti-radio-mini-height) - 2px);
-
-      .@{radio-prefix-cls}__inner {
-        height: var(--ti-radio-mini-inner-height);
-        width: var(--ti-radio-mini-inner-width);
-
-        &::after {
-          width: 4px;
-          height: 4px;
-        }
-      }
-
-      .@{radio-prefix-cls}__label {
-        font-size: var(--ti-radio-font-size);
-      }
-    }
-  }
   &.is-checked.is-display-only {
     visibility: visible;
     line-height: 1;
@@ -241,15 +170,17 @@
       padding: 0;
       display: none;
     }
+
     .tiny-radio__label {
       padding-left: 0;
     }
   }
+
   &.is-display-only {
     visibility: hidden;
   }
 
   &:focus:not(.is-focus):not(:active):not(.is-disabled) &__inner {
-    box-shadow: 0 0 2px 2px var(--ti-radio-bordered-hover-border-color);
+    box-shadow: 0 0 2px 2px var(--tv-Radio-bordered-hover-border-color);
   }
 }
diff --git a/packages/theme/src/radio/vars.less b/packages/theme/src/radio/vars.less
index 0ce45592e..587e8ad9a 100644
--- a/packages/theme/src/radio/vars.less
+++ b/packages/theme/src/radio/vars.less
@@ -10,83 +10,49 @@
 *
 */
 
-.component-css-vars-radio() {
+.inject-radio-vars() {
   // 单选框默认文本色
-  --ti-radio-text-color: var(--ti-common-color-text-primary, #252b3a);
+  --tv-Radio-text-color: var(--tv-color-text);
   // 单选框字号
-  --ti-radio-font-size: var(--ti-common-font-size-0);
-  // 带边框类单选框默认高度
-  --ti-radio-bordered-height: var(--ti-common-size-height-normal);
+  --tv-Radio-font-size: var(--tv-font-size-sm);
   // 带边框类单选框圆角
-  --ti-radio-bordered-border-radius: var(--ti-common-border-radius-normal, 2px);
+  --tv-Radio-bordered-border-radius: var(--tv-border-radius-md);
   // 单选框默认边框色
-  --ti-radio-bordered-border-color: var(--ti-common-color-line-normal);
+  --tv-Radio-bordered-border-color: var(--tv-color-border);
   // 单选框默认禁用边框色
-  --ti-radio-input-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6);
+  --tv-Radio-input-disabled-border-color: var(--tv-color-border-disabled);
   // 单选框的选中状态时的边框色
-  --ti-radio-bordered-checked-border-color: #1476FF;
-  // 单选框的选中状态时的背景色
-  --ti-radio-bordered-checked-background-color: var(--ti-common-color-bg-white-normal, #fff);
+  --tv-Radio-bordered-checked-border-color: var(--tv-color-border-active-control);
   // 单选框的带有边框时悬浮时的边框色
-  --ti-radio-bordered-hover-border-color: var(--ti-common-color-info-hover);
+  --tv-Radio-bordered-hover-border-color: var(--tv-color-border-hover);
   // 单选框的带有边框时选中时的边框色
-  --ti-radio-bordered-checked-hover-border-color: #1476FF;
+  --tv-Radio-bordered-checked-hover-border-color: var(--tv-color-border-active-control);
   // 单选框的带有边框时激活时的边框色
-  --ti-radio-bordered-active-border-color: var(--ti-common-color-line-active, #5e7ce0);
+  --tv-Radio-bordered-active-border-color: var(--tv-color-border-active-control);
   // 单选框的禁用状态时的背景色
-  --ti-radio-input-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6);
+  --tv-Radio-input-disabled-bg-color: var(--tv-color-bg-disabled);
   // 单选框为选中且禁用状态时的背景色
-  --ti-radio-input-checked-disabled-bg-color: #fff;
+  --tv-Radio-input-checked-disabled-bg-color: var(--tv-color-bg-secondary);
   // 单选框为选中且禁用状态时的边框色
-  --ti-radio-input-checked-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6);
+  --tv-Radio-input-checked-disabled-border-color: var(--tv-color-border-disabled);
   // 单选框为输入框样式时禁用状态时的文本色
-  --ti-radio-input-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8);
+  --tv-Radio-input-disabled-text-color: var(--tv-color-text-disabled);
   // 单选框单选按钮的背景色
-  --ti-radio-inner-bg-color: var(--ti-common-color-bg-white-normal, #fff);
+  --tv-Radio-inner-bg-color: var(--tv-color-bg-secondary);
   // 单选框单选按钮选中时的背景色
-  --ti-radio-inner-checked-bg-color: #1476FF;
+  --tv-Radio-inner-checked-bg-color: var(--tv-color-bg-active-control);
   // 单选框单选按钮的尺寸
-  --ti-radio-inner-size: var(--ti-common-size-2x, 8px);
+  --tv-Radio-inner-size: 8px;
   // 单选框单选按钮为选中且禁用状态时的背景色
-  --ti-radio-inner-checked-disabled-bg-color: var(--ti-common-color-bg-dark-disabled);
-  // 单选按钮为medium尺寸时的高度
-  --ti-radio-medium-height: var(--ti-common-size-height-small, 32px);
-  // 单选框单选按钮为medium尺寸时的高度
-  --ti-radio-medium-inner-height: calc(var(--ti-common-size-3x, 12px) + 2px);
-  // 单选框单选按钮为medium尺寸时的宽度
-  --ti-radio-medium-inner-width: calc(var(--ti-common-size-3x, 12px) + 2px);
-  // 单选按钮为small尺寸时的高度
-  --ti-radio-small-height: var(--ti-common-size-8x, 32px);
-  // 单选框单选按钮为small尺寸时的高度
-  --ti-radio-small-inner-height: var(--ti-common-size-3x, 12px);
-  // 单选框单选按钮为small尺寸时的宽度
-  --ti-radio-small-inner-width: var(--ti-common-size-3x, 12px);
-  // 单选按钮为mini尺寸时的高度
-  --ti-radio-mini-height: var(--ti-common-size-7x, 28px);
-  // 单选框单选按钮为mini尺寸时的高度
-  --ti-radio-mini-inner-height: var(--ti-common-size-3x, 12px);
-  // 单选框单选按钮为mini尺寸时的宽度
-  --ti-radio-mini-inner-width: var(--ti-common-size-3x, 12px);
+  --tv-Radio-inner-checked-disabled-bg-color: var(--tv-color-bg-disabled-control-checked);
   // 单选框单选按钮的边框圆角半径
-  --ti-radio-inner-border-radius: 100%;
-  // 单选框尺寸为mini时的带有边框时垂直方向的内边距
-  --ti-radio-mini-bordered-padding-vertical: var(--ti-common-space-0, 0px);
-  // 单选框尺寸为mini时的带有边框时水平方向的内边距
-  --ti-radio-mini-bordered-padding-horizontal: var(--ti-common-space-2x, 8px);
-  // 单选框的带有边框时垂直方向的内边距
-  --ti-radio-bordered-padding-vertical: var(--ti-common-space-base, 4px);
-  // 单选框的带有边框时水平方向的内边距
-  --ti-radio-bordered-padding-horizontal: var(--ti-common-space-3x, 12px);
-  // 单选框的带有边框时左侧的外边距
-  --ti-radio-mini-bordered-margin-left: var(--ti-common-space-10, 10px);
+  --tv-Radio-inner-border-radius: var(--tv-border-radius-round);
   // 单选框单选按钮宽度
-  --ti-radio-inner-width: var(--ti-common-size-4x, 16px);
+  --tv-Radio-inner-width: 16px;
   // 单选框单选按钮宽度
-  --ti-radio-inner-height: var(--ti-common-size-4x, 16px);
+  --tv-Radio-inner-height: 16px;
   // 单选组每个选项之间的间距
-  --ti-radio-margin-right: var(--ti-common-space-6x);
-  // 单选框单选按钮选中后悬浮时的背景色
-  --ti-radio-inner-checked-hover-bg-color: #1476FF;
+  --tv-Radio-margin-right: 24px;
   // 单选按钮底部外边距
-  --ti-radio-button-margin-bottom: var(--ti-common-space-4x);
+  --tv-Radio-button-margin-bottom: var(--tv-space-xl);
 }