diff --git a/packages/opendesign/src/components/_shared/global.ts b/packages/opendesign/src/components/_shared/global.ts
index f6e0c94417577af5951dc0576b6a3132c6b1bea2..83db256fecaf68d213eb94b57bfd2896445f3afd 100644
--- a/packages/opendesign/src/components/_shared/global.ts
+++ b/packages/opendesign/src/components/_shared/global.ts
@@ -12,4 +12,4 @@ export type ShapeT = 'round' | 'normal'
 export const defaultShape = ref<ShapeT>('normal');
 export function initShape(type: ShapeT) {
   defaultShape.value = type;
-}
\ No newline at end of file
+}
diff --git a/packages/opendesign/src/components/button/style/index.scss b/packages/opendesign/src/components/button/style/index.scss
index 0425ceacdee76ee3a8da1f58dfd5bbc2e42833e8..6c71fd9d5ce765ba9cef56ac9e3ee330a517c2e2 100644
--- a/packages/opendesign/src/components/button/style/index.scss
+++ b/packages/opendesign/src/components/button/style/index.scss
@@ -5,7 +5,7 @@
   border: 1px solid transparent;
   font-size: var(--btn-text-size);
   line-height: var(--btn-text-height);
-  transition: all 0.2s ease-in-out;
+  transition: all var(--o-duration-s) var(--o-easing-standard);
   white-space: nowrap;
   cursor: pointer;
 
diff --git a/packages/opendesign/src/components/link/style/index.scss b/packages/opendesign/src/components/link/style/index.scss
index 0ddde8c2346610f22bc9f40bc7bf5f558d5d1057..e90f42eb00faa79bb9bfdde73a3b2469d13eceba 100644
--- a/packages/opendesign/src/components/link/style/index.scss
+++ b/packages/opendesign/src/components/link/style/index.scss
@@ -29,7 +29,7 @@
   }
 
   &.arrow svg {
-    transition: transform var(--o-transition-duration-2);
+    transition: transform var(--o-duration-s) var(--o-easing-standard);
   }
 }
 
diff --git a/packages/opendesign/src/components/option/OOption.vue b/packages/opendesign/src/components/option/OOption.vue
index 76aace7c7ce3f24655e6240e47cbe3ef5da527cf..4ec51e94488563b911f1ca82f0be2b55dfac1f3d 100644
--- a/packages/opendesign/src/components/option/OOption.vue
+++ b/packages/opendesign/src/components/option/OOption.vue
@@ -13,7 +13,7 @@ const props = withDefaults(defineProps<OptionPropT>(), {
   label: '',
 });
 
-const selectInject = inject(selectOptionInjectKey);
+const selectInject = inject(selectOptionInjectKey, null);
 
 const currentVal = computed(() => {
   if (selectInject) {
diff --git a/packages/opendesign/src/components/popup/style/index.scss b/packages/opendesign/src/components/popup/style/index.scss
index f9928e45ea4cb2bf316d56b7ddc71ca2162548bb..e2748664e7960e7b891ce465e0c671fc3356bed7 100644
--- a/packages/opendesign/src/components/popup/style/index.scss
+++ b/packages/opendesign/src/components/popup/style/index.scss
@@ -4,7 +4,7 @@
   position: absolute;
   z-index: 100;
   opacity: 1;
-  transition: opacity var(--o-transition-duration-3);
+  transition: opacity var(--o-duration-m1) var(--o-easing-standard);
   &.out-view {
     opacity: 0;
     pointer-events: none;
diff --git a/packages/opendesign/src/components/radio/style/index.scss b/packages/opendesign/src/components/radio/style/index.scss
index 6ed649f8cec9b4007eea1f4acb48b898f2a7ded8..a3519a15db546c2b9fd430f0352fd34320991814 100644
--- a/packages/opendesign/src/components/radio/style/index.scss
+++ b/packages/opendesign/src/components/radio/style/index.scss
@@ -64,7 +64,7 @@
     height: 12px;
     border-radius: 50%;
     background-color: transparent;
-    transition: background-color 0.3s;
+    transition: background-color var(--o-duration-s) var(--o-easing-standard);
   }
 }
 
diff --git a/packages/opendesign/src/components/select/style/index.scss b/packages/opendesign/src/components/select/style/index.scss
index 7e252450e935c5b08f7d47d3ea6e961a76a3c9f0..e8a611edd7622b7e0fc856a3914f98c810189539 100644
--- a/packages/opendesign/src/components/select/style/index.scss
+++ b/packages/opendesign/src/components/select/style/index.scss
@@ -62,7 +62,7 @@
   color: var(--select-icon-color);
   display: inline-flex;
   align-items: center;
-  transition: transform var(--o-transition-duration-2);
+  transition: transform var(--o-duration-s) var(--o-easing-standard);
   svg {
     display: block;
   }
diff --git a/packages/opendesign/src/components/style/animation.scss b/packages/opendesign/src/components/style/animation.scss
index 8d3fefaa6c6d50eda501156185c7dae9942db8e5..619bff4d6acb9d687552d8cfe00adc7d16c26757 100644
--- a/packages/opendesign/src/components/style/animation.scss
+++ b/packages/opendesign/src/components/style/animation.scss
@@ -9,7 +9,7 @@
 }
 
 .o-rotating {
-  animation: o-rotating var(--o-transition-duration-long) var(--o-transition-function-linear) infinite;
+  animation: o-rotating 2s var(--o-easing-linear) infinite;
 }
 
 @keyframes o-zoom-fade-in {
@@ -24,10 +24,10 @@
 }
 
 .o-zoom-fade-enter-active {
-  animation: o-zoom-fade-in var(--o-transition-duration-long);
+  animation: o-zoom-fade-in var(--o-duration-m1);
 }
 .o-zoom-fade-leave-active {
-  animation: o-zoom-fade-in var(--o-transition-duration-1) reverse;
+  animation: o-zoom-fade-in var(--o-duration-s) reverse;
 }
 
 @keyframes o-fade-in {
@@ -51,15 +51,17 @@
 }
 
 .o-fade-up-enter-enter-active {
-  animation: o-fade-up var(--o-transition-duration-6);
+  animation: o-fade-up var(--o-duration-s) var(--o-easing-standard-out);
 }
 .o-fade-in-enter-enter-active {
-  animation: o-fade-in var(--o-transition-duration-6);
+  animation: o-fade-in var(--o-duration-m1) var(--o-easing-standard-in);
 }
 
-.o-fade-up-enter-active,
+.o-fade-up-enter-active {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
 .o-fade-up-leave-active {
-  transition: all var(--o-transition-duration-6) var(--o-transition-function-ease-out);
+  transition: all var(--o-duration-s) var(--o-easing-standard-out);
 }
 
 .o-fade-up-enter-from,
diff --git a/packages/opendesign/src/components/style/index.scss b/packages/opendesign/src/components/style/index.scss
index 9546225a203a2a7516f9bd424c29b43c163ca2f5..910d07e821ac9c9ed4fa8ab0b763453c412bbf72 100644
--- a/packages/opendesign/src/components/style/index.scss
+++ b/packages/opendesign/src/components/style/index.scss
@@ -5,22 +5,6 @@
   box-sizing: border-box;
 }
 
-:root {
-  --o-size-l: 40px;
-  --o-size-m: 32px;
-  --o-size-s: 24px;
-  --o-transition-duration-1: 0.1s;
-  --o-transition-duration-2: 0.2s;
-  --o-transition-duration-3: 0.3s;
-  --o-transition-duration-4: 0.4s;
-  --o-transition-duration-6: 0.6s;
-  --o-transition-duration-long: 1.5s;
-
-  --o-transition-function-linear: linear;
-  --o-transition-function-ease-in: ease-in;
-  --o-transition-function-ease-out: cubic-bezier(0, 0, 0.25, 1);
-}
-
 // icons
 .o-icon {
   --icon-g1: var(--o-color-text1);
diff --git a/packages/opendesign/src/components/style/token.css b/packages/opendesign/src/components/style/token.css
index bb1690a65c7dfd7bd8af80dc8984807335260582..2222dda109cfa353e2d085c1a796de7bbe523956 100644
--- a/packages/opendesign/src/components/style/token.css
+++ b/packages/opendesign/src/components/style/token.css
@@ -1,4 +1,35 @@
+/* 全局变量，不随皮肤变化 */
 :root {
+  --o-size-l: 40px;
+  --o-size-m: 32px;
+  --o-size-s: 24px;
+
+  /* Exit */
+  --o-duration-s: 200ms;
+  /* Enter for standard-in */
+  --o-duration-m1: 250ms;
+  /* Begin and End for standard */
+  --o-duration-m2: 300ms;
+  /* Enter for emphasized-in */
+  --o-duration-m3: 400ms;
+  /* Begin and End for emphasized */
+  --o-duration-l: 500ms;
+  /* 轮播切换 for emphasized */
+  --o-duration-xl: 1000ms;
+
+  --o-easing-linear: cubic-bezier(0, 0, 1, 1);
+  /* 用于组件 */
+  --o-easing-standard: cubic-bezier(0.2, 0, 0, 1);
+  --o-easing-standard-in: cubic-bezier(0, 0, 0, 1);
+  --o-easing-standard-out: cubic-bezier(0.3, 0, 1, 1);
+  /* 用于大卡片、场景切换 */
+  --o-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
+  --o-easing-emphasized-in: cubic-bezier(0.3, 0, 0.8, 0.15);
+  --o-easing-emphasized-out: cubic-bezier(0.05, 0.7, 0.1, 1);
+}
+
+:root,
+:root[theme="light"] {
   /* 品牌色 */
   --o-color-primary1: #002fa7;
   --o-color-primary2: #406fe7;
@@ -15,7 +46,7 @@
   --o-color-warning1: #ff8e36;
   --o-color-warning2: #ffb45c;
   --o-color-warning3: #ff801c;
-  --o-color-warning4: #ffd2af; 
+  --o-color-warning4: #ffd2af;
   /* 错误色 */
   --o-color-danger1: #f3524d;
   --o-color-danger2: #ff7873;
diff --git a/packages/opendesign/src/components/switch/style/index.scss b/packages/opendesign/src/components/switch/style/index.scss
index 80e57f6c802ba97071103b53ca6ac287bebff100..c8d4d9dd848e8c513646540de5a51dccdc428f3b 100644
--- a/packages/opendesign/src/components/switch/style/index.scss
+++ b/packages/opendesign/src/components/switch/style/index.scss
@@ -4,7 +4,7 @@
   position: relative;
   background-color: var(--switch-bg);
   color: var(--switch-color);
-  transition: background-color var(--o-transition-duration-3);
+  transition: background-color var(--o-duration-s) var(--o-easing-standard);
   cursor: pointer;
 
   .o-switch-handler {
@@ -12,7 +12,7 @@
     top: 50%;
     transform: translateY(-50%);
     background-color: var(--switch-handler-bg);
-    transition: left var(--o-transition-duration-3);
+    transition: left var(--o-duration-s) var(--o-easing-standard);
 
     .o-switch-icon_loading {
       width: 100%;
diff --git a/packages/opendesign/src/components/tabs/OTabPane.vue b/packages/opendesign/src/components/tabs/OTabPane.vue
index 39f5faca24f42a94dd741ab4cbe109111437ef54..0f2115ff44736df328e95418172bce886e34c4dd 100644
--- a/packages/opendesign/src/components/tabs/OTabPane.vue
+++ b/packages/opendesign/src/components/tabs/OTabPane.vue
@@ -56,7 +56,7 @@ export default defineComponent({
     },
   },
   setup(props, { slots, attrs }) {
-    const tabsInjection = inject(tabsInjectKey);
+    const tabsInjection = inject(tabsInjectKey, null);
 
     const instance = getCurrentInstance();
 
diff --git a/packages/opendesign/src/components/tabs/TabContent.vue b/packages/opendesign/src/components/tabs/TabContent.vue
index d9681cc3cdd78179dd5657d86a55bd46386bda4d..afaf74d0e895b217e977344b5aa8b61fc7088a2b 100644
--- a/packages/opendesign/src/components/tabs/TabContent.vue
+++ b/packages/opendesign/src/components/tabs/TabContent.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import { computed, defineComponent, h, mergeProps, PropType, Transition, vShow, withDirectives, SetupContext, Slots, ref } from 'vue';
+import { computed, defineComponent, h, mergeProps, PropType, Transition, vShow, withDirectives, SetupContext, Slots } from 'vue';
 
 export default defineComponent({
   name: 'TabContent',
@@ -56,11 +56,11 @@ export default defineComponent({
     const active = computed(() => props.activeValue === props.value);
     const toMount = computed(() => (props.lazy ? active.value : true));
 
-    // pane只渲染default 插槽的内容
+    // content只渲染default 插槽的内容
     return () => {
       const p = mergeProps(
         {
-          class: ['o-tab-pane', { active: active.value }],
+          class: ['o-tab-content', { active: active.value }],
         },
         props.attrs
       );
diff --git a/packages/opendesign/src/components/tabs/style/index.scss b/packages/opendesign/src/components/tabs/style/index.scss
index a2e41a6a871265803c4962243faa1bf3c89c29ff..e70ef06f1e6ac04cbc2d4e0d292eb073aa381887 100644
--- a/packages/opendesign/src/components/tabs/style/index.scss
+++ b/packages/opendesign/src/components/tabs/style/index.scss
@@ -83,7 +83,7 @@
   display: flex;
 }
 
-.o-tab-pane {
+.o-tab-content {
   flex-shrink: 0;
   width: 100%;
   display: none;