diff --git a/packages/docs/global.md b/packages/docs/global.md
new file mode 100644
index 0000000000000000000000000000000000000000..304d9c082fdb569b818fc5cb219a8af7fe47cab5
--- /dev/null
+++ b/packages/docs/global.md
@@ -0,0 +1,10 @@
+# 全局配置
+
+## 方法
+
+| name    | type        | 默认值    | 说明                                 |
+| :------ | :---------- | :-------- | :----------------------------------- |
+| shape   | ShapeT      | 'normal'  | 形状: large \| normal \| small       |
+| size    | SizeT       | 'normal'  | 形状 normal \| round                 |
+| type    | ButtonTypeT | 'outline' | 形状 primary \|outline\| text \|link |
+| loading | boolean     | false     | 加载状态                             |
diff --git a/packages/opendesign/src/components/_shared/dom.ts b/packages/opendesign/src/components/_shared/dom.ts
index 879a065f0636a417251ba79cdbf67afc8f688622..4af7fb196e8f582d85ab67c8d9c7f08b57f20142 100644
--- a/packages/opendesign/src/components/_shared/dom.ts
+++ b/packages/opendesign/src/components/_shared/dom.ts
@@ -1,3 +1,5 @@
+import { isArray } from './utils';
+
 export type DirectionT = 'left' | 'right' | 'top' | 'bottom';
 
 export function isElement(el: any) {
@@ -79,7 +81,7 @@ export function getElementBorder(el: HTMLElement, dir?: DirectionT | DirectionT[
   if (typeof dir === 'string') {
     d = [dir];
   } else {
-    d = Array.isArray(dir) ? dir : ['left', 'right', 'bottom', 'top'];
+    d = isArray(dir) ? dir : ['left', 'right', 'bottom', 'top'];
   }
   const rlt: {
     left?: number,
diff --git a/packages/opendesign/src/components/_shared/export.ts b/packages/opendesign/src/components/_shared/export.ts
new file mode 100644
index 0000000000000000000000000000000000000000..03cc56910ac84dbaaa403028d218d925bb1b89e3
--- /dev/null
+++ b/packages/opendesign/src/components/_shared/export.ts
@@ -0,0 +1,7 @@
+export { initSize, initShape } from './global';
+
+export {
+  initLoadingIcon,
+  initLinkArrowIcon,
+  initLinkPrefixIcon
+} from './icons';
\ No newline at end of file
diff --git a/packages/opendesign/src/components/_shared/global.ts b/packages/opendesign/src/components/_shared/global.ts
index f86e3eca8fa2004c9c239a57eddaa55d21358f79..f6e0c94417577af5951dc0576b6a3132c6b1bea2 100644
--- a/packages/opendesign/src/components/_shared/global.ts
+++ b/packages/opendesign/src/components/_shared/global.ts
@@ -2,18 +2,14 @@ import { ref } from 'vue';
 
 // 尺寸
 export type SizeT = 'large' | 'normal' | 'small'
-
 export const defaultSize = ref<SizeT>('normal');
-
 export function initSize(type: SizeT) {
   defaultSize.value = type;
 }
 
 // 形状
 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/_shared/icons.ts b/packages/opendesign/src/components/_shared/icons.ts
index 4b46b1b1ffcd40e8f5130c79862dca018ea2b60b..27320a3ab9b3c2a25158422c09227d97e40b1ef9 100644
--- a/packages/opendesign/src/components/_shared/icons.ts
+++ b/packages/opendesign/src/components/_shared/icons.ts
@@ -1,30 +1,33 @@
 /**
  * 定义全局图标，支持全局初始化自定义
  */
-import { IconLoading, IconLink, IconArrowRight } from '../icons';
-import type { Component } from 'vue';
+import { Component, shallowRef } from 'vue';
+import {
+  IconLoading as _IconLoading,
+  IconLink as IconLink,
+  IconArrowRight
+} from '../icons';
 
-let iLoading: Component = IconLoading;
-export function setLoadingIcon(icon: Component) {
-  iLoading = icon;
-}
-export function getLoadingIcon() {
-  return iLoading;
+/**
+ * 全局loading图标
+ */
+export const IconLoading = shallowRef<Component>(_IconLoading);
+export function initLoadingIcon(icon: Component) {
+  IconLoading.value = icon;
 }
 
-
-let iLink: Component = IconLink;
-export function setLinkIcon(icon: Component) {
-  iLink = icon;
-}
-export function getLinkIcon() {
-  return iLink;
+/**
+ * link前缀图标
+ */
+export const IconLinkPrefix = shallowRef<Component>(IconLink);
+export function initLinkPrefixIcon(icon: Component) {
+  IconLinkPrefix.value = icon;
 }
 
-let iLinkArrow: Component = IconArrowRight;
-export function setLinkArrowIcon(icon: Component) {
-  iLinkArrow = icon;
-}
-export function getLinkArrowIcon() {
-  return iLinkArrow;
+/**
+ * link箭头图标
+ */
+export const IconLinkArrow = shallowRef<Component>(IconArrowRight);
+export function initLinkArrowIcon(icon: Component) {
+  IconLinkArrow.value = icon;
 }
\ No newline at end of file
diff --git a/packages/opendesign/src/components/button/OButton.vue b/packages/opendesign/src/components/button/OButton.vue
index c857ebc7f2c9b477b0ff567efb0dbffa420f0596..74885620d3527a2fca5ea8389389d2e7d26c9113 100644
--- a/packages/opendesign/src/components/button/OButton.vue
+++ b/packages/opendesign/src/components/button/OButton.vue
@@ -2,7 +2,7 @@
 import { defaultSize, defaultShape } from '../_shared/global';
 import type { SizeT, ShapeT } from '../_shared/global';
 import { ButtonTypeT } from './types';
-import { getLoadingIcon } from '../_shared/icons';
+import { IconLoading } from '../_shared/icons';
 
 interface ButtonPropT {
   /**
@@ -24,10 +24,9 @@ interface ButtonPropT {
 }
 const props = withDefaults(defineProps<ButtonPropT>(), {
   type: 'outline',
-  size: defaultSize.value,
-  shape: defaultShape.value,
+  size: undefined,
+  shape: undefined,
 });
-const IconLoading = getLoadingIcon();
 </script>
 <template>
   <button
@@ -35,8 +34,8 @@ const IconLoading = getLoadingIcon();
     class="o-btn"
     :class="[
       `o-btn-${props.type}`,
-      `o-btn-size-${props.size}`,
-      `o-btn-shape-${props.shape}`,
+      `o-btn-size-${props.size || defaultSize}`,
+      `o-btn-shape-${props.shape || defaultShape}`,
       {
         'o-btn-icon-only': $slots.icon && !$slots.default,
       },
diff --git a/packages/opendesign/src/components/config.ts b/packages/opendesign/src/components/config.ts
deleted file mode 100644
index 0c01796531bec9c043a3d3c1096e7f6cb6c3ac79..0000000000000000000000000000000000000000
--- a/packages/opendesign/src/components/config.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { initSize, Size } from './_shared/global';
-
-export {
-  initSize,
-  Size,
-};
\ No newline at end of file
diff --git a/packages/opendesign/src/components/index.ts b/packages/opendesign/src/components/index.ts
index 08d57631c5b26b0ef00e4a8b3dd65b776879f57b..8ef3d90b6ca718069a4de4387a5f784399cda395 100644
--- a/packages/opendesign/src/components/index.ts
+++ b/packages/opendesign/src/components/index.ts
@@ -1,4 +1,4 @@
-export * from './_shared/global';
+export * from './_shared/export';
 
 export * from './hooks';
 
diff --git a/packages/opendesign/src/components/link/OLink.vue b/packages/opendesign/src/components/link/OLink.vue
index 37e59f5a04217d7f3f865347ceab75293d5c52e7..71e4f1e0dae69a175d8b9188a57ff72bed1238fb 100644
--- a/packages/opendesign/src/components/link/OLink.vue
+++ b/packages/opendesign/src/components/link/OLink.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { getLoadingIcon, getLinkIcon, getLinkArrowIcon } from '../_shared/icons';
+import { IconLinkPrefix, IconLinkArrow, IconLoading } from '../_shared/icons';
 
 interface LinkPropsT {
   /**
@@ -54,9 +54,6 @@ const onClick = (e: MouseEvent) => {
   }
   emits('click', e);
 };
-const IconLoading = getLoadingIcon();
-const IconLink = getLinkIcon();
-const IconLinkArrow = getLinkArrowIcon();
 </script>
 <template>
   <a
@@ -70,7 +67,7 @@ const IconLinkArrow = getLinkArrowIcon();
     <span v-if="props.icon || $slots.icon || props.loading" class="o-link-icon prefix">
       <IconLoading v-if="props.loading" class="o-roating" />
       <slot v-else-if="$slots.icon" name="icon"></slot>
-      <IconLink v-else />
+      <IconLinkPrefix v-else />
     </span>
     <slot></slot>
     <span v-if="$slots.iconSuffix" class="o-link-icon suffix">
diff --git a/packages/opendesign/src/components/link/style/index.scss b/packages/opendesign/src/components/link/style/index.scss
index 2162677546e674978fda59d415ec2710f160d987..0ddde8c2346610f22bc9f40bc7bf5f558d5d1057 100644
--- a/packages/opendesign/src/components/link/style/index.scss
+++ b/packages/opendesign/src/components/link/style/index.scss
@@ -21,7 +21,6 @@
 }
 
 .o-link-icon {
-  vertical-align: middle;
   &.prefix {
     margin-right: 2px;
   }
diff --git a/packages/opendesign/src/components/popup/OPopup.vue b/packages/opendesign/src/components/popup/OPopup.vue
index acdc699c52a718149faa87858ab5b645dab220cd..8f4c04d83c4a35eab21223b4615563fa477c77f2 100644
--- a/packages/opendesign/src/components/popup/OPopup.vue
+++ b/packages/opendesign/src/components/popup/OPopup.vue
@@ -7,7 +7,7 @@ export default {
 import { onMounted, reactive, ref, Ref, watch, nextTick, onUnmounted, PropType, ComponentPublicInstance, computed } from 'vue';
 import { PopupPositionT, PopupTriggerT } from './types';
 import { isElement, getScrollParents } from '../_shared/dom';
-import { throttleRAF } from '../_shared/utils';
+import { isArray, throttleRAF } from '../_shared/utils';
 import { calcPopupStyle, bindTrigger, getTransformOrigin } from './popup';
 import { useResizeObserver } from '../hooks/use-resize-observer';
 import { ResizeObserver } from '../resize-observer';
@@ -120,7 +120,7 @@ const props = defineProps({
 });
 
 const emits = defineEmits<{ (e: 'update:visible', val: boolean): void; (e: 'change', val: boolean): void }>();
-const triggers = Array.isArray(props.trigger) ? props.trigger : [props.trigger];
+const triggers = isArray(props.trigger) ? props.trigger : [props.trigger];
 
 const visible = ref(false);
 let targetEl: HTMLElement | null = null;
diff --git a/packages/opendesign/src/components/select/OSelect.vue b/packages/opendesign/src/components/select/OSelect.vue
index 72b214a6ce3ca4ddb58d17ef505bb19ce6ad3255..d993f3a4ed8eb912c473ac11e137d59c52ba1f74 100644
--- a/packages/opendesign/src/components/select/OSelect.vue
+++ b/packages/opendesign/src/components/select/OSelect.vue
@@ -25,8 +25,8 @@ interface SelectPropT {
 }
 const props = withDefaults(defineProps<SelectPropT>(), {
   modelValue: '',
-  size: defaultSize.value,
-  shape: defaultShape.value,
+  size: undefined,
+  shape: undefined,
   placeholder: 'please select...',
   optionPosition: 'bl',
   optionWidthMode: 'min-width',
@@ -63,7 +63,11 @@ provide(selectOptionInjectKey, {
   <div
     ref="selectRef"
     class="o-select"
-    :class="[`o-select-size-${props.size}`, `o-select-shape-${props.shape}`, { 'is-selecting': showOption, 'is-disabled': props.disabled }]"
+    :class="[
+      `o-select-size-${props.size || defaultSize}`,
+      `o-select-shape-${props.shape || defaultShape}`,
+      { 'is-selecting': showOption, 'is-disabled': props.disabled },
+    ]"
   >
     <input :value="activeLabel" type="text" :placeholder="props.placeholder" class="o-select-input" readonly />
     <span class="o-select-suffix">
diff --git a/packages/opendesign/src/components/style/index.scss b/packages/opendesign/src/components/style/index.scss
index 3803c291bd7a2631b612bd91c126672c561b71eb..07b57ffe49c7b08cff00d9cb6f610b0ab3a5e246 100644
--- a/packages/opendesign/src/components/style/index.scss
+++ b/packages/opendesign/src/components/style/index.scss
@@ -29,7 +29,7 @@
   display: inline-block;
   width: 1em;
   height: 1em;
-  vertical-align: middle;
+  vertical-align: -0.2em;
   color: inherit;
   font-style: normal;
   outline: none;
diff --git a/packages/opendesign/src/components/switch/OSwitch.vue b/packages/opendesign/src/components/switch/OSwitch.vue
index df75b037cf9d4bd5df4fe35b2ea4c8d28fd2aa83..4fe72f99d49bddf8ef9c2aa8f4bf046bc83e35fe 100644
--- a/packages/opendesign/src/components/switch/OSwitch.vue
+++ b/packages/opendesign/src/components/switch/OSwitch.vue
@@ -3,7 +3,7 @@ import { isPromise, isBoolean } from '../_shared/utils';
 
 import { defaultSize, defaultShape } from '../_shared/global';
 import type { SizeT, ShapeT } from '../_shared/global';
-import { getLoadingIcon } from '../_shared/icons';
+import { IconLoading } from '../_shared/icons';
 
 interface SwitchPropT {
   /**
@@ -21,8 +21,8 @@ interface SwitchPropT {
 }
 
 const props = withDefaults(defineProps<SwitchPropT>(), {
-  size: defaultSize.value,
-  shape: defaultShape.value,
+  size: undefined,
+  shape: undefined,
   modelValue: false,
   disabled: false,
   loading: false,
@@ -68,15 +68,14 @@ const onClick = () => {
       console.warn(`${err}`);
     });
 };
-const IconLoading = getLoadingIcon();
 </script>
 
 <template>
   <div
     class="o-switch"
     :class="[
-      `o-switch-size-${props.size}`,
-      `o-switch-shape-${props.shape}`,
+      `o-switch-size-${props.size || defaultSize}`,
+      `o-switch-shape-${props.shape || defaultShape}`,
       { 'is-checked': props.modelValue },
       { 'is-disabled': props.disabled },
       { 'is-loading': props.loading },
diff --git a/packages/portal/src/components/TheHeader.vue b/packages/portal/src/components/TheHeader.vue
index 03024a727716b71fa0d80c9642f55653834390cb..4aedd9c2dc328e2d003f132f399cdb9d2856689f 100644
--- a/packages/portal/src/components/TheHeader.vue
+++ b/packages/portal/src/components/TheHeader.vue
@@ -1,12 +1,23 @@
 <script setup lang="ts">
+import { initLoadingIcon, initSize } from '@opensig/opendesign/src/components';
+import { IconAdd } from '@opensig/opendesign/src/components/icons';
+
 const title = 'opendesign';
+
+const globalSetting = () => {
+  initLoadingIcon(IconAdd);
+  initSize('large');
+};
 </script>
 <template>
   <div class="the-header">
     {{ title }}
+    <div class="tools">
+      <div class="tool-item" @click="globalSetting">全局设置</div>
+    </div>
   </div>
 </template>
-<style lang="scss">
+<style lang="scss" scoped>
 .the-header {
   color: #333;
   display: flex;
@@ -14,5 +25,13 @@ const title = 'opendesign';
   justify-content: center;
   background-color: #f6f6f6;
   box-shadow: 0px 2px 8px rgba($color: #000000, $alpha: 0.1);
+  position: relative;
+}
+.tools {
+  position: absolute;
+  right: 24px;
+  .tool-item {
+    cursor: pointer;
+  }
 }
 </style>
diff --git a/packages/portal/src/main.ts b/packages/portal/src/main.ts
index 635e1840a948e89ad8d49534da8fb5afa2b5e2e8..c79bb2ee57890e4ea158d58608f1785af0e23fee 100644
--- a/packages/portal/src/main.ts
+++ b/packages/portal/src/main.ts
@@ -4,13 +4,11 @@ import 'normalize.css';
 import '@opensig/opendesign/src/components/style/token.css';
 import '@opensig/opendesign/src/components/style';
 
-// import { initSize } from 'opendesign/config';
+
 import { router } from '@/router';
 
 import App from './App.vue';
 
-// initSize(SizeT.LARGE);
-
 const app = createApp(App);
 
 app.use(router);