diff --git a/docSite/content/zh-cn/docs/development/upgrading/484.md b/docSite/content/zh-cn/docs/development/upgrading/484.md
new file mode 100644
index 000000000..fd551cd42
--- /dev/null
+++ b/docSite/content/zh-cn/docs/development/upgrading/484.md
@@ -0,0 +1,22 @@
+---
+title: 'V4.8.4(进行中)'
+description: 'FastGPT V4.8.4 更新说明'
+icon: 'upgrade'
+draft: false
+toc: true
+weight: 821
+---
+
+<!-- ## 升级指南
+
+- fastgpt 镜像 tag 修改成 v4.8.4
+- fastgpt-sandbox 镜像 tag 修改成 v4.8.4 (选择性，无变更)
+- 商业版镜像 tag 修改成 v4.8.4 -->
+
+## V4.8.4 更新说明
+
+1. 新增 - 应用使用新权限系统。
+2. 优化 - 文本分割增加连续换行、制表符清除，避免大文本性能问题。
+3. 修复 - Debug 模式下，相同 source 和 target 内容，导致连线显示异常。
+4. 修复 - 定时执行初始化错误。
+5. 调整组件库全局theme。
\ No newline at end of file
diff --git a/packages/global/common/string/textSplitter.ts b/packages/global/common/string/textSplitter.ts
index 7ef609a74..41c09df5a 100644
--- a/packages/global/common/string/textSplitter.ts
+++ b/packages/global/common/string/textSplitter.ts
@@ -102,6 +102,8 @@ const commonSplit = (props: SplitProps): SplitResponse => {
   text = text.replace(/(```[\s\S]*?```|~~~[\s\S]*?~~~)/g, function (match) {
     return match.replace(/\n/g, codeBlockMarker);
   });
+  // replace invalid \n
+  text = text.replace(/(\r?\n|\r){3,}/g, '\n\n\n');
 
   // The larger maxLen is, the next sentence is less likely to trigger splitting
   const stepReges: { reg: RegExp; maxLen: number }[] = [
@@ -338,7 +340,7 @@ const commonSplit = (props: SplitProps): SplitResponse => {
  */
 export const splitText2Chunks = (props: SplitProps): SplitResponse => {
   let { text = '' } = props;
-
+  const start = Date.now();
   const splitWithCustomSign = text.split(CUSTOM_SPLIT_SIGN);
 
   const splitResult = splitWithCustomSign.map((item) => {
@@ -348,7 +350,7 @@ export const splitText2Chunks = (props: SplitProps): SplitResponse => {
 
     return commonSplit(props);
   });
-
+  console.log(Date.now() - start);
   return {
     chunks: splitResult.map((item) => item.chunks).flat(),
     chars: splitResult.reduce((sum, item) => sum + item.chars, 0)
diff --git a/packages/global/core/workflow/template/system/systemConfig.ts b/packages/global/core/workflow/template/system/systemConfig.ts
index fbaffe118..c563dbefd 100644
--- a/packages/global/core/workflow/template/system/systemConfig.ts
+++ b/packages/global/core/workflow/template/system/systemConfig.ts
@@ -1,6 +1,6 @@
 import { FlowNodeTypeEnum } from '../../node/constant';
 import { FlowNodeTemplateType } from '../../type/index.d';
-import { FlowNodeTemplateTypeEnum, WorkflowIOValueTypeEnum } from '../../constants';
+import { FlowNodeTemplateTypeEnum } from '../../constants';
 import { getHandleConfig } from '../utils';
 
 export const SystemConfigNode: FlowNodeTemplateType = {
diff --git a/packages/service/common/file/gridfs/controller.ts b/packages/service/common/file/gridfs/controller.ts
index 88242d2bb..147cb4656 100644
--- a/packages/service/common/file/gridfs/controller.ts
+++ b/packages/service/common/file/gridfs/controller.ts
@@ -8,7 +8,7 @@ import { detectFileEncoding } from '@fastgpt/global/common/file/tools';
 import { CommonErrEnum } from '@fastgpt/global/common/error/code/common';
 import { MongoRawTextBuffer } from '../../buffer/rawText/schema';
 import { readRawContentByFileBuffer } from '../read/utils';
-import { PassThrough } from 'stream';
+import { gridFsStream2Buffer } from './utils';
 
 export function getGFSCollection(bucket: `${BucketNameEnum}`) {
   MongoFileSchema;
@@ -113,35 +113,16 @@ export async function getDownloadStream({
   fileId: string;
 }) {
   const bucket = getGridBucket(bucketName);
-  const stream = bucket.openDownloadStream(new Types.ObjectId(fileId));
-  const copyStream = stream.pipe(new PassThrough());
+  const encodeStream = bucket.openDownloadStream(new Types.ObjectId(fileId), { end: 100 });
+  const rawStream = bucket.openDownloadStream(new Types.ObjectId(fileId));
 
   /* get encoding */
-  const buffer = await (() => {
-    return new Promise<Buffer>((resolve, reject) => {
-      let tmpBuffer: Buffer = Buffer.from([]);
-
-      stream.on('data', (chunk) => {
-        if (tmpBuffer.length < 20) {
-          tmpBuffer = Buffer.concat([tmpBuffer, chunk]);
-        }
-        if (tmpBuffer.length >= 20) {
-          resolve(tmpBuffer);
-        }
-      });
-      stream.on('end', () => {
-        resolve(tmpBuffer);
-      });
-      stream.on('error', (err) => {
-        reject(err);
-      });
-    });
-  })();
+  const buffer = await gridFsStream2Buffer(encodeStream);
 
   const encoding = detectFileEncoding(buffer);
 
   return {
-    fileStream: copyStream,
+    fileStream: rawStream,
     encoding
     // encoding: 'utf-8'
   };
@@ -169,32 +150,21 @@ export const readFileContentFromMongo = async ({
       filename: fileBuffer.metadata?.filename || ''
     };
   }
+  const start = Date.now();
 
   const [file, { encoding, fileStream }] = await Promise.all([
     getFileById({ bucketName, fileId }),
     getDownloadStream({ bucketName, fileId })
   ]);
-
+  // console.log('get file stream', Date.now() - start);
   if (!file) {
     return Promise.reject(CommonErrEnum.fileNotFound);
   }
 
   const extension = file?.filename?.split('.')?.pop()?.toLowerCase() || '';
 
-  const fileBuffers = await (() => {
-    return new Promise<Buffer>((resolve, reject) => {
-      let buffer = Buffer.from([]);
-      fileStream.on('data', (chunk) => {
-        buffer = Buffer.concat([buffer, chunk]);
-      });
-      fileStream.on('end', () => {
-        resolve(buffer);
-      });
-      fileStream.on('error', (err) => {
-        reject(err);
-      });
-    });
-  })();
+  const fileBuffers = await gridFsStream2Buffer(fileStream);
+  // console.log('get file buffer', Date.now() - start);
 
   const { rawText } = await readRawContentByFileBuffer({
     extension,
diff --git a/packages/service/common/file/gridfs/utils.ts b/packages/service/common/file/gridfs/utils.ts
new file mode 100644
index 000000000..27ccafb48
--- /dev/null
+++ b/packages/service/common/file/gridfs/utils.ts
@@ -0,0 +1,15 @@
+export const gridFsStream2Buffer = (stream: NodeJS.ReadableStream) => {
+  return new Promise<Buffer>((resolve, reject) => {
+    let tmpBuffer: Buffer = Buffer.from([]);
+
+    stream.on('data', (chunk) => {
+      tmpBuffer = Buffer.concat([tmpBuffer, chunk]);
+    });
+    stream.on('end', () => {
+      resolve(tmpBuffer);
+    });
+    stream.on('error', (err) => {
+      reject(err);
+    });
+  });
+};
diff --git a/packages/web/components/common/DateRangePicker/index.tsx b/packages/web/components/common/DateRangePicker/index.tsx
index ce9dfe81d..4fc096c86 100644
--- a/packages/web/components/common/DateRangePicker/index.tsx
+++ b/packages/web/components/common/DateRangePicker/index.tsx
@@ -49,11 +49,13 @@ const DateRangePicker = ({
         py={1}
         borderRadius={'sm'}
         cursor={'pointer'}
-        bg={'myWhite.600'}
+        bg={'myGray.100'}
         fontSize={'sm'}
         onClick={() => setShowSelected(true)}
       >
-        <Box>{formatSelected}</Box>
+        <Box color={'myGray.600'} fontWeight={'400'}>
+          {formatSelected}
+        </Box>
         <MyIcon ml={2} name={'date'} w={'16px'} color={'myGray.600'} />
       </Flex>
       {showSelected && (
diff --git a/packages/web/components/common/DndDrag/DragIcon.tsx b/packages/web/components/common/DndDrag/DragIcon.tsx
index 36eedd13c..687d14199 100644
--- a/packages/web/components/common/DndDrag/DragIcon.tsx
+++ b/packages/web/components/common/DndDrag/DragIcon.tsx
@@ -5,7 +5,7 @@ import { DraggableProvided } from 'react-beautiful-dnd';
 
 const DragIcon = ({ provided, ...props }: { provided: DraggableProvided } & BoxProps) => {
   return (
-    <Box {...provided.dragHandleProps} {...props}>
+    <Box {...provided.dragHandleProps} {...props} lineHeight={1}>
       <DragHandleIcon color={'myGray.500'} _hover={{ color: 'primary.600' }} />
     </Box>
   );
diff --git a/packages/web/components/common/EmptyTip/index.tsx b/packages/web/components/common/EmptyTip/index.tsx
index e91294353..fd78c8440 100644
--- a/packages/web/components/common/EmptyTip/index.tsx
+++ b/packages/web/components/common/EmptyTip/index.tsx
@@ -12,7 +12,7 @@ const EmptyTip = ({ text, ...props }: Props) => {
   return (
     <Flex mt={5} flexDirection={'column'} alignItems={'center'} py={'10vh'} {...props}>
       <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-      <Box mt={2} color={'myGray.500'}>
+      <Box mt={2} color={'myGray.500'} fontSize={'sm'}>
         {text || t('common.empty.Common Tip')}
       </Box>
     </Flex>
diff --git a/packages/web/components/common/MyBox/FormLabel.tsx b/packages/web/components/common/MyBox/FormLabel.tsx
new file mode 100644
index 000000000..bea971fa4
--- /dev/null
+++ b/packages/web/components/common/MyBox/FormLabel.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+import { Box, BoxProps } from '@chakra-ui/react';
+
+const FormLabel = ({
+  children,
+  ...props
+}: BoxProps & {
+  children: React.ReactNode;
+}) => {
+  return (
+    <Box color={'myGray.900'} fontSize={'sm'} {...props}>
+      {children}
+    </Box>
+  );
+};
+
+export default FormLabel;
diff --git a/packages/web/components/common/MyDrawer/CustomRightDrawer.tsx b/packages/web/components/common/MyDrawer/CustomRightDrawer.tsx
index 911e62072..14d2dceb1 100644
--- a/packages/web/components/common/MyDrawer/CustomRightDrawer.tsx
+++ b/packages/web/components/common/MyDrawer/CustomRightDrawer.tsx
@@ -56,7 +56,7 @@ const CustomRightDrawer = ({
             )}
           </>
         )}
-        <Box flex={'1'} fontSize={'lg'}>
+        <Box flex={'1'} fontSize={'md'}>
           {title}
         </Box>
         <CloseButton position={'relative'} fontSize={'sm'} top={0} right={0} onClick={onClose} />
diff --git a/packages/web/components/common/MyDrawer/MyRightDrawer.tsx b/packages/web/components/common/MyDrawer/MyRightDrawer.tsx
index fe6e22793..e16a15176 100644
--- a/packages/web/components/common/MyDrawer/MyRightDrawer.tsx
+++ b/packages/web/components/common/MyDrawer/MyRightDrawer.tsx
@@ -61,7 +61,7 @@ const MyRightDrawer = ({
               )}
             </>
           )}
-          <Box flex={'1'} fontSize={'lg'}>
+          <Box flex={'1'} fontSize={'md'}>
             {title}
           </Box>
           <DrawerCloseButton position={'relative'} fontSize={'sm'} top={0} right={0} />
diff --git a/packages/web/components/common/MyMenu/index.tsx b/packages/web/components/common/MyMenu/index.tsx
index 02876ca1e..ddd70f5b4 100644
--- a/packages/web/components/common/MyMenu/index.tsx
+++ b/packages/web/components/common/MyMenu/index.tsx
@@ -9,6 +9,7 @@ import {
   MenuItemProps
 } from '@chakra-ui/react';
 import MyIcon from '../Icon';
+import MyDivider from '../MyDivider';
 
 type MenuItemType = 'primary' | 'danger';
 
@@ -18,11 +19,14 @@ export type Props = {
   Button: React.ReactNode;
   trigger?: 'hover' | 'click';
   menuList: {
-    isActive?: boolean;
-    label: string | React.ReactNode;
-    icon?: string;
-    type?: MenuItemType;
-    onClick: () => any;
+    label?: string;
+    children: {
+      isActive?: boolean;
+      type?: MenuItemType;
+      icon?: string;
+      label: string | React.ReactNode;
+      onClick: () => any;
+    }[];
   }[];
 };
 
@@ -49,9 +53,11 @@ const MyMenu = ({
   };
   const menuItemStyles: MenuItemProps = {
     borderRadius: 'sm',
-    py: 3,
+    py: 2,
+    px: 3,
     display: 'flex',
-    alignItems: 'center'
+    alignItems: 'center',
+    fontSize: 'sm'
   };
   const ref = useRef<HTMLDivElement>(null);
   const closeTimer = useRef<any>();
@@ -109,23 +115,32 @@ const MyMenu = ({
             '0px 2px 4px rgba(161, 167, 179, 0.25), 0px 0px 1px rgba(121, 141, 159, 0.25);'
           }
         >
-          {menuList.map((item, i) => (
-            <MenuItem
-              key={i}
-              {...menuItemStyles}
-              {...typeMapStyle[item.type || 'primary']}
-              onClick={(e) => {
-                e.stopPropagation();
-                setIsOpen(false);
-                item.onClick && item.onClick();
-              }}
-              color={item.isActive ? 'primary.700' : 'myGray.600'}
-              whiteSpace={'pre-wrap'}
-            >
-              {!!item.icon && <MyIcon name={item.icon as any} w={'16px'} mr={2} />}
-              {item.label}
-            </MenuItem>
-          ))}
+          {menuList.map((item, i) => {
+            return (
+              <Box key={i}>
+                {item.label && <Box fontSize={'sm'}>{item.label}</Box>}
+                {i !== 0 && <MyDivider h={'1.5px'} my={1} />}
+                {item.children.map((child, index) => (
+                  <MenuItem
+                    key={index}
+                    {...menuItemStyles}
+                    {...typeMapStyle[child.type || 'primary']}
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setIsOpen(false);
+                      child.onClick && child.onClick();
+                    }}
+                    color={child.isActive ? 'primary.700' : 'myGray.600'}
+                    whiteSpace={'pre-wrap'}
+                    _notLast={{ mb: 0.5 }}
+                  >
+                    {!!child.icon && <MyIcon name={child.icon as any} w={'16px'} mr={2} />}
+                    <Box>{child.label}</Box>
+                  </MenuItem>
+                ))}
+              </Box>
+            );
+          })}
         </MenuList>
       </Box>
     </Menu>
diff --git a/packages/web/components/common/MyModal/index.tsx b/packages/web/components/common/MyModal/index.tsx
index 2cfd10b6a..8b9ac6837 100644
--- a/packages/web/components/common/MyModal/index.tsx
+++ b/packages/web/components/common/MyModal/index.tsx
@@ -64,6 +64,7 @@ const MyModal = ({
             borderBottom={'1px solid #F4F6F8'}
             roundedTop={'lg'}
             py={'10px'}
+            fontSize={'md'}
           >
             {iconSrc && (
               <>
diff --git a/packages/web/components/common/MySelect/MultipleSelect.tsx b/packages/web/components/common/MySelect/MultipleSelect.tsx
index be74e8f08..282d9ba71 100644
--- a/packages/web/components/common/MySelect/MultipleSelect.tsx
+++ b/packages/web/components/common/MySelect/MultipleSelect.tsx
@@ -1,7 +1,7 @@
 import { Box, Flex, useDisclosure, useOutsideClick } from '@chakra-ui/react';
 import React, { useRef } from 'react';
 import { useTranslation } from 'next-i18next';
-import FillTag from '../Tag/index';
+import MyTag from '../Tag/index';
 import MyIcon from '../Icon';
 
 export type SelectProps = {
@@ -51,7 +51,7 @@ const MultipleSelect = ({
           if (!listItem) return null;
 
           return (
-            <FillTag colorSchema="blue" p={2} cursor={'default'}>
+            <MyTag colorSchema="blue" p={2} cursor={'default'}>
               {listItem.alias || listItem.label}
               <MyIcon
                 name={'common/closeLight'}
@@ -63,7 +63,7 @@ const MultipleSelect = ({
                   onSelect(value.filter((i) => i !== item));
                 }}
               />
-            </FillTag>
+            </MyTag>
           );
         })}
         {value.length === 0 && placeholder && (
diff --git a/packages/web/components/common/MySelect/index.tsx b/packages/web/components/common/MySelect/index.tsx
index 05bebfadb..aa1afb2a0 100644
--- a/packages/web/components/common/MySelect/index.tsx
+++ b/packages/web/components/common/MySelect/index.tsx
@@ -135,6 +135,7 @@ const MySelect = (
                 }
               }}
               whiteSpace={'pre-wrap'}
+              fontSize={'sm'}
             >
               {item.label}
             </MenuItem>
diff --git a/packages/web/components/common/MyTooltip/QuestionTip.tsx b/packages/web/components/common/MyTooltip/QuestionTip.tsx
index 205245c8a..57a449165 100644
--- a/packages/web/components/common/MyTooltip/QuestionTip.tsx
+++ b/packages/web/components/common/MyTooltip/QuestionTip.tsx
@@ -9,7 +9,7 @@ type Props = IconProps & {
 const QuestionTip = ({ label, maxW, ...props }: Props) => {
   return (
     <MyTooltip label={label} maxW={maxW}>
-      <QuestionOutlineIcon {...props} />
+      <QuestionOutlineIcon w={'0.9rem'} {...props} />
     </MyTooltip>
   );
 };
diff --git a/packages/web/components/common/MyTooltip/index.tsx b/packages/web/components/common/MyTooltip/index.tsx
index 25982258d..a33e57639 100644
--- a/packages/web/components/common/MyTooltip/index.tsx
+++ b/packages/web/components/common/MyTooltip/index.tsx
@@ -17,7 +17,7 @@ const MyTooltip = ({ children, forceShow = false, shouldWrapChildren = true, ...
       })}
     >
       <Tooltip
-        className="tooltip"
+        className="chakra-tooltip"
         bg={'white'}
         arrowShadowColor={'rgba(0,0,0,0.05)'}
         hasArrow
diff --git a/packages/web/components/common/Radio/LeftRadio.tsx b/packages/web/components/common/Radio/LeftRadio.tsx
index f80e951b5..991a450e7 100644
--- a/packages/web/components/common/Radio/LeftRadio.tsx
+++ b/packages/web/components/common/Radio/LeftRadio.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import { Box, Flex, useTheme, Grid, type GridProps } from '@chakra-ui/react';
 import { useTranslation } from 'next-i18next';
 import MyTooltip from '../MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import QuestionTip from '../MyTooltip/QuestionTip';
 
 // @ts-ignore
@@ -95,6 +94,7 @@ const LeftRadio = ({
                 color={'myGray.900'}
                 fontWeight={item.desc ? '500' : 'normal'}
                 whiteSpace={'nowrap'}
+                fontSize={'sm'}
               >
                 {typeof item.title === 'string' ? t(item.title) : item.title}
               </Box>
diff --git a/packages/web/components/common/Tabs/RowTabs.tsx b/packages/web/components/common/Tabs/RowTabs.tsx
index 9246836d7..846387000 100644
--- a/packages/web/components/common/Tabs/RowTabs.tsx
+++ b/packages/web/components/common/Tabs/RowTabs.tsx
@@ -23,6 +23,7 @@ const RowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props }: P
       borderColor={'borderColor.base'}
       bg={'myGray.50'}
       gap={'4px'}
+      fontSize={'sm'}
       {...props}
     >
       {list.map((item) => (
diff --git a/packages/web/components/common/Tag/index.tsx b/packages/web/components/common/Tag/index.tsx
index bb22d79b9..b8fa9a18a 100644
--- a/packages/web/components/common/Tag/index.tsx
+++ b/packages/web/components/common/Tag/index.tsx
@@ -1,69 +1,78 @@
 import React, { useMemo } from 'react';
 import { Flex, type FlexProps } from '@chakra-ui/react';
 
+type ColorSchemaType = 'blue' | 'green' | 'red' | 'yellow' | 'gray' | 'purple' | 'adora';
+
 interface Props extends FlexProps {
   children: React.ReactNode | React.ReactNode[];
-  colorSchema?: 'blue' | 'green' | 'gray' | 'purple';
-  type?: 'fill' | 'solid';
+  colorSchema?: ColorSchemaType;
+  type?: 'fill' | 'borderFill' | 'borderSolid';
 }
 
+const colorMap: Record<
+  ColorSchemaType,
+  {
+    borderColor: string;
+    bg: string;
+    color: string;
+  }
+> = {
+  yellow: {
+    borderColor: 'yellow.200',
+    bg: 'yellow.50',
+    color: 'yellow.600'
+  },
+  green: {
+    borderColor: 'green.200',
+    bg: 'green.50',
+    color: 'green.600'
+  },
+  red: {
+    borderColor: 'red.200',
+    bg: 'red.50',
+    color: 'red.600'
+  },
+  gray: {
+    borderColor: 'myGray.200',
+    bg: 'myGray.50',
+    color: 'myGray.700'
+  },
+  blue: {
+    borderColor: 'primary.200',
+    bg: 'primary.50',
+    color: 'primary.600'
+  },
+  purple: {
+    borderColor: '#ECF',
+    bg: '#F6EEFA',
+    color: '#A558C9'
+  },
+  adora: {
+    borderColor: '#D3CAFF',
+    bg: '#F0EEFF',
+    color: '#6F5DD7'
+  }
+};
+
 const MyTag = ({ children, colorSchema = 'blue', type = 'fill', ...props }: Props) => {
   const theme = useMemo(() => {
-    const fillMap = {
-      blue: {
-        borderColor: 'primary.200',
-        bg: 'primary.50',
-        color: 'primary.700'
-      },
-      green: {
-        borderColor: 'green.200',
-        bg: 'green.50',
-        color: 'green.600'
-      },
-      purple: {
-        borderColor: '#ECF',
-        bg: '#F6EEFA',
-        color: '#A558C9'
-      },
-      gray: {
-        borderColor: 'myGray.200',
-        bg: 'myGray.50',
-        color: 'myGray.700'
-      }
-    };
-    const solidMap = {
-      blue: {
-        borderColor: 'primary.200',
-        color: 'primary.600'
-      },
-      green: {
-        borderColor: 'green.200',
-        color: 'green.600'
-      },
-      purple: {
-        borderColor: '#ECF',
-        color: '#9E53C1'
-      },
-      gray: {
-        borderColor: 'myGray.200',
-        color: 'myGray.700'
-      }
-    };
-    return type === 'fill' ? fillMap[colorSchema] : solidMap[colorSchema];
+    return colorMap[colorSchema];
   }, [colorSchema]);
 
   return (
     <Flex
-      px={2}
+      px={2.5}
       lineHeight={1}
       py={1}
       borderRadius={'sm'}
-      fontSize={'sm'}
+      fontSize={'xs'}
       alignItems={'center'}
       whiteSpace={'nowrap'}
       borderWidth={'1px'}
-      {...props}
       {...theme}
+      {...props}
+      borderColor={type !== 'fill' ? theme.borderColor : 'transparent'}
+      bg={type !== 'borderSolid' ? theme.bg : 'transparent'}
     >
       {children}
     </Flex>
diff --git a/packages/web/components/common/Textarea/PromptEditor/Editor.tsx b/packages/web/components/common/Textarea/PromptEditor/Editor.tsx
index be8bcfe44..6203c3fea 100644
--- a/packages/web/components/common/Textarea/PromptEditor/Editor.tsx
+++ b/packages/web/components/common/Textarea/PromptEditor/Editor.tsx
@@ -105,7 +105,7 @@ export default function Editor({
             >
               <Box
                 color={'myGray.400'}
-                fontSize={'11px'}
+                fontSize={'mini'}
                 userSelect={'none'}
                 whiteSpace={'pre-wrap'}
                 wordBreak={'break-all'}
diff --git a/packages/web/components/common/Textarea/PromptEditor/index.module.scss b/packages/web/components/common/Textarea/PromptEditor/index.module.scss
index bd3a7b45c..8a24228b4 100644
--- a/packages/web/components/common/Textarea/PromptEditor/index.module.scss
+++ b/packages/web/components/common/Textarea/PromptEditor/index.module.scss
@@ -6,7 +6,7 @@
   border-radius: var(--chakra-radii-md);
   padding: 8px 12px;
   background: var(--chakra-colors-gray-50);
-  font-size: 14px;
+  font-size: var(--chakra-fontSizes-sm);
   overflow-y: auto;
 }
 
@@ -18,7 +18,7 @@
   border-radius: var(--chakra-radii-sm);
   padding: 6px 8px;
   background: #fff;
-  font-size: 14px;
+  font-size: var(--chakra-fontSizes-sm);
   overflow-y: auto;
 }
 
diff --git a/packages/web/components/core/workflow/NodeInputSelect.tsx b/packages/web/components/core/workflow/NodeInputSelect.tsx
index b5ddabf5a..249e375bd 100644
--- a/packages/web/components/core/workflow/NodeInputSelect.tsx
+++ b/packages/web/components/core/workflow/NodeInputSelect.tsx
@@ -142,7 +142,7 @@ const NodeInputSelect = ({
 
   return (
     <MyMenu
-      offset={[0, -1]}
+      offset={[-0.5, -0.5]}
       Button={
         <Button
           size={'xs'}
@@ -154,7 +154,7 @@ const NodeInputSelect = ({
           <Box fontWeight={'medium'}>{renderTypeData.title}</Box>
         </Button>
       }
-      menuList={filterMenuList}
+      menuList={[{ children: filterMenuList }]}
     />
   );
 };
diff --git a/packages/web/hooks/useScrollPagination.tsx b/packages/web/hooks/useScrollPagination.tsx
index 40de950ef..78eaeb75f 100644
--- a/packages/web/hooks/useScrollPagination.tsx
+++ b/packages/web/hooks/useScrollPagination.tsx
@@ -115,7 +115,7 @@ export function useScrollPagination<
           <MyBox isLoading={isLoading} ref={containerRef} overflow={'overlay'} {...props}>
             <Box ref={wrapperRef}>{children}</Box>
             {noMore.current && list.length > 0 && (
-              <Box py={4} textAlign={'center'} color={'myGray.600'} fontSize={'sm'}>
+              <Box py={4} textAlign={'center'} color={'myGray.600'} fontSize={'xs'}>
                 {t('common.No more data')}
               </Box>
             )}
diff --git a/packages/web/hooks/useToast.ts b/packages/web/hooks/useToast.tsx
similarity index 90%
rename from packages/web/hooks/useToast.ts
rename to packages/web/hooks/useToast.tsx
index 734563578..533cd4a8b 100644
--- a/packages/web/hooks/useToast.ts
+++ b/packages/web/hooks/useToast.tsx
@@ -5,6 +5,9 @@ export const useToast = (props?: UseToastOptions) => {
   const toast = uToast({
     position: 'top',
     duration: 2000,
+    containerStyle: {
+      fontSize: 'sm'
+    },
     ...props
   });
 
diff --git a/packages/web/styles/theme.ts b/packages/web/styles/theme.ts
index 8748f64d2..be514200a 100644
--- a/packages/web/styles/theme.ts
+++ b/packages/web/styles/theme.ts
@@ -4,13 +4,14 @@ import {
   switchAnatomy,
   selectAnatomy,
   numberInputAnatomy,
-  checkboxAnatomy
+  checkboxAnatomy,
+  tableAnatomy,
+  radioAnatomy
 } from '@chakra-ui/anatomy';
 import { createMultiStyleConfigHelpers, defineStyle } from '@chakra-ui/styled-system';
 
-const { definePartsStyle, defineMultiStyleConfig } = createMultiStyleConfigHelpers(
-  modalAnatomy.keys
-);
+const { definePartsStyle: modalPart, defineMultiStyleConfig: modalMultiStyle } =
+  createMultiStyleConfigHelpers(modalAnatomy.keys);
 const { definePartsStyle: switchPart, defineMultiStyleConfig: switchMultiStyle } =
   createMultiStyleConfigHelpers(switchAnatomy.keys);
 const { definePartsStyle: selectPart, defineMultiStyleConfig: selectMultiStyle } =
@@ -19,6 +20,10 @@ const { definePartsStyle: numInputPart, defineMultiStyleConfig: numInputMultiSty
   createMultiStyleConfigHelpers(numberInputAnatomy.keys);
 const { definePartsStyle: checkBoxPart, defineMultiStyleConfig: checkBoxMultiStyle } =
   createMultiStyleConfigHelpers(checkboxAnatomy.keys);
+const { definePartsStyle: tablePart, defineMultiStyleConfig: tableMultiStyle } =
+  createMultiStyleConfigHelpers(tableAnatomy.keys);
+const { definePartsStyle: radioParts, defineMultiStyleConfig: radioStyle } =
+  createMultiStyleConfigHelpers(radioAnatomy.keys);
 
 const shadowLight = '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15)';
 
@@ -65,7 +70,7 @@ const Button = defineStyleConfig({
       borderRadius: '8px'
     },
     md: {
-      fontSize: 'md',
+      fontSize: 'sm',
       px: '20px',
       py: 0,
       h: '36px',
@@ -73,7 +78,7 @@ const Button = defineStyleConfig({
       borderRadius: '8px'
     },
     mdSquare: {
-      fontSize: 'md',
+      fontSize: 'sm',
       px: '0',
       py: 0,
       h: '36px',
@@ -267,9 +272,6 @@ const Button = defineStyleConfig({
 });
 
 const Input: ComponentStyleConfig = {
-  baseStyle: {
-    fontsize: '1rem'
-  },
   sizes: {
     sm: defineStyle({
       field: {
@@ -312,13 +314,15 @@ const NumberInput = numInputMultiStyle({
     sm: defineStyle({
       field: {
         h: '32px',
-        borderRadius: 'md'
+        borderRadius: 'md',
+        fontsize: 'sm'
       }
     }),
     md: defineStyle({
       field: {
         h: '40px',
-        borderRadius: 'md'
+        borderRadius: 'md',
+        fontsize: 'sm'
       }
     })
   },
@@ -359,6 +363,7 @@ const Textarea: ComponentStyleConfig = {
       border: '1px solid',
       borderRadius: 'md',
       borderColor: 'myGray.200',
+      fontSize: 'sm',
       _hover: {
         borderColor: ''
       },
@@ -406,12 +411,34 @@ const Select = selectMultiStyle({
   }
 });
 
+const Radio = radioStyle({
+  baseStyle: radioParts({
+    control: {
+      _hover: {
+        borderColor: 'primary.300',
+        bg: 'primary.50'
+      },
+      _checked: {
+        borderColor: 'primary.600',
+        bg: 'primary.50',
+        boxShadow: shadowLight,
+        _before: {
+          bg: 'primary.600'
+        },
+        _hover: {
+          bg: 'primary.50'
+        }
+      }
+    }
+  })
+});
 const Checkbox = checkBoxMultiStyle({
   baseStyle: checkBoxPart({
     label: {
       fontFamily: 'mono' // change the font family of the label
     },
     control: {
+      borderRadius: 'xs',
       bg: 'none',
       _checked: {
         bg: 'primary.50',
@@ -429,10 +456,10 @@ const Checkbox = checkBoxMultiStyle({
   })
 });
 
-const Modal = defineMultiStyleConfig({
-  baseStyle: definePartsStyle({
+const Modal = modalMultiStyle({
+  baseStyle: modalPart({
     body: {
-      py: [3, 5],
+      py: [2, 4],
       px: [5, 7]
     },
     footer: {
@@ -441,20 +468,62 @@ const Modal = defineMultiStyleConfig({
   })
 });
 
+const Table = tableMultiStyle({
+  sizes: {
+    md: defineStyle({
+      table: {
+        fontsize: 'sm'
+      },
+      thead: {
+        tr: {
+          bg: 'myGray.100',
+          fontSize: 'sm',
+          th: {
+            borderBottom: 'none',
+            overflow: 'hidden',
+            '&:first-of-type': {
+              borderLeftRadius: 'md'
+            },
+            '&:last-of-type': {
+              borderRightRadius: 'md'
+            }
+          }
+        }
+      },
+      tbody: {
+        tr: {
+          td: {
+            overflow: 'hidden',
+            '&:first-of-type': {
+              borderLeftRadius: 'md'
+            },
+            '&:last-of-type': {
+              borderRightRadius: 'md'
+            }
+          }
+        }
+      }
+    })
+  },
+  defaultProps: {
+    size: 'md'
+  }
+});
+
 // 全局主题
 export const theme = extendTheme({
   styles: {
     global: {
       'html, body': {
-        fontSize: '14px',
-        color: 'myGray.900',
-        fontWeight: 400,
+        color: 'myGray.600',
+        fontWeight: 'normal',
         height: '100%',
         overflow: 'hidden'
       },
       a: {
         color: 'primary.600'
       },
+
       '*': {
         _focusVisible: {
           boxShadow: 'none'
@@ -586,16 +655,17 @@ export const theme = extendTheme({
     body: 'PingFang,Noto Sans,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"'
   },
   fontSizes: {
+    mini: '0.75rem',
     xs: '0.8rem',
-    sm: '0.93rem',
+    sm: '0.875rem',
     md: '1rem',
-    lg: '1.15rem',
-    xl: '1.3rem',
-    '2xl': '1.45rem',
-    '3xl': '1.6rem',
-    '4xl': '1.75rem',
-    '5xl': '1.9rem',
-    '6xl': '2.05rem'
+    lg: '1.25rem',
+    xl: '1.5rem',
+    '2xl': '1.75rem',
+    '3xl': '2rem',
+    '4xl': '2.25rem',
+    '5xl': '2.8rem',
+    '6xl': '3.6rem'
   },
   borders: {
     sm: '1px solid #E8EBF0',
@@ -644,6 +714,8 @@ export const theme = extendTheme({
     Select,
     NumberInput,
     Checkbox,
-    Modal
+    Modal,
+    Table,
+    Radio
   }
 });
diff --git a/projects/app/i18n/zh/common.json b/projects/app/i18n/zh/common.json
index 02e211a7a..60301e8c8 100644
--- a/projects/app/i18n/zh/common.json
+++ b/projects/app/i18n/zh/common.json
@@ -532,6 +532,7 @@
       "Go Dataset": "前往知识库",
       "Intro Placeholder": "这个知识库还没有介绍~",
       "Manual collection": "手动数据集",
+      "externalFile": "外部文件库",
       "My Dataset": "我的知识库",
       "Name": "知识库名称",
       "Query extension intro": "开启问题优化功能，可以提高提高连续对话时，知识库搜索的精度。开启该功能后，在进行知识库搜索时，会根据对话记录，利用 AI 补全问题缺失的信息。",
@@ -585,8 +586,7 @@
             "success": "开始同步"
           }
         },
-        "training": {
-        }
+        "training": {}
       },
       "data": {
         "Auxiliary Data": "辅助数据",
diff --git a/projects/app/src/components/ChatBox/Input/ChatInput.tsx b/projects/app/src/components/ChatBox/Input/ChatInput.tsx
index 35166c147..190b5a535 100644
--- a/projects/app/src/components/ChatBox/Input/ChatInput.tsx
+++ b/projects/app/src/components/ChatBox/Input/ChatInput.tsx
@@ -3,7 +3,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { Box, Flex, Image, Spinner, Textarea } from '@chakra-ui/react';
 import React, { useRef, useEffect, useCallback } from 'react';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '../../MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
diff --git a/projects/app/src/components/ChatBox/components/ResponseTags.tsx b/projects/app/src/components/ChatBox/components/ResponseTags.tsx
index b695a9216..71594c5b9 100644
--- a/projects/app/src/components/ChatBox/components/ResponseTags.tsx
+++ b/projects/app/src/components/ChatBox/components/ResponseTags.tsx
@@ -7,7 +7,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import type { SearchDataResponseItemType } from '@fastgpt/global/core/dataset/type';
 import dynamic from 'next/dynamic';
 import MyTag from '@fastgpt/web/components/common/Tag/index';
-import MyTooltip from '../../MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { FlowNodeTypeEnum } from '@fastgpt/global/core/workflow/node/constant';
 import { getSourceNameIcon } from '@fastgpt/global/core/dataset/utils';
 import ChatBoxDivider from '@/components/core/chat/Divider';
@@ -108,9 +108,9 @@ const ResponseTags = ({
               <MyTooltip key={item.collectionId} label={t('core.chat.quote.Read Quote')}>
                 <Flex
                   alignItems={'center'}
-                  fontSize={'sm'}
+                  fontSize={'xs'}
                   border={theme.borders.sm}
-                  py={1}
+                  py={1.5}
                   px={2}
                   borderRadius={'sm'}
                   _hover={{
@@ -149,7 +149,7 @@ const ResponseTags = ({
             <MyTooltip label="查看引用">
               <MyTag
                 colorSchema="blue"
-                type="solid"
+                type="borderSolid"
                 cursor={'pointer'}
                 onClick={() => setQuoteModalData({ rawSearch: quoteList })}
               >
@@ -164,7 +164,7 @@ const ResponseTags = ({
                   <MyTag
                     colorSchema="green"
                     cursor={'pointer'}
-                    type="solid"
+                    type="borderSolid"
                     onClick={() => setContextModalData(historyPreview)}
                   >
                     {historyPreview.length}条上下文
@@ -174,20 +174,25 @@ const ResponseTags = ({
             </>
           )}
           {llmModuleAccount > 1 && (
-            <MyTag type="solid" colorSchema="blue">
+            <MyTag type="borderSolid" colorSchema="blue">
               多组 AI 对话
             </MyTag>
           )}
 
           {isPc && runningTime > 0 && (
             <MyTooltip label={'模块运行时间和'}>
-              <MyTag colorSchema="purple" type="solid" cursor={'default'}>
+              <MyTag colorSchema="purple" type="borderSolid" cursor={'default'}>
                 {runningTime}s
               </MyTag>
             </MyTooltip>
           )}
           <MyTooltip label={t('core.chat.response.Read complete response tips')}>
-            <MyTag colorSchema="gray" type="solid" cursor={'pointer'} onClick={onOpenWholeModal}>
+            <MyTag
+              colorSchema="gray"
+              type="borderSolid"
+              cursor={'pointer'}
+              onClick={onOpenWholeModal}
+            >
               {t('core.chat.response.Read complete response')}
             </MyTag>
           </MyTooltip>
diff --git a/projects/app/src/components/ChatBox/components/SelectMarkCollection.tsx b/projects/app/src/components/ChatBox/components/SelectMarkCollection.tsx
index 46166eeb8..bcc4255b5 100644
--- a/projects/app/src/components/ChatBox/components/SelectMarkCollection.tsx
+++ b/projects/app/src/components/ChatBox/components/SelectMarkCollection.tsx
@@ -8,6 +8,7 @@ import DatasetSelectModal, { useDatasetSelect } from '@/components/core/dataset/
 import dynamic from 'next/dynamic';
 import { AdminFbkType } from '@fastgpt/global/core/chat/type.d';
 import SelectCollections from '@/web/core/dataset/components/SelectCollections';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const InputDataModal = dynamic(() => import('@/pages/dataset/detail/components/InputDataModal'));
 
@@ -76,7 +77,7 @@ const SelectMarkCollection = ({
                     >
                       <Flex alignItems={'center'} h={'38px'}>
                         <Avatar src={item.avatar} w={['24px', '28px', '32px']}></Avatar>
-                        <Box ml={3} fontWeight={'bold'} fontSize={['md', 'lg', 'xl']}>
+                        <Box ml={3} fontWeight={'bold'} fontSize={['md', 'lg']}>
                           {item.name}
                         </Box>
                       </Flex>
@@ -89,14 +90,7 @@ const SelectMarkCollection = ({
                 })()
               )}
             </Grid>
-            {datasets.length === 0 && (
-              <Flex mt={'10vh'} flexDirection={'column'} alignItems={'center'}>
-                <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-                <Box mt={2} color={'myGray.500'}>
-                  这个目录已经没东西可选了~
-                </Box>
-              </Flex>
-            )}
+            {datasets.length === 0 && <EmptyTip text={'这个目录已经没东西可选了~'}></EmptyTip>}
           </ModalBody>
         </DatasetSelectModal>
       )}
diff --git a/projects/app/src/components/ChatBox/components/WholeResponseModal.tsx b/projects/app/src/components/ChatBox/components/WholeResponseModal.tsx
index dbb7dcd06..ee4a7fc98 100644
--- a/projects/app/src/components/ChatBox/components/WholeResponseModal.tsx
+++ b/projects/app/src/components/ChatBox/components/WholeResponseModal.tsx
@@ -6,13 +6,13 @@ import { moduleTemplatesFlat } from '@fastgpt/global/core/workflow/template/cons
 
 import Tabs from '../../Tabs';
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import MyTooltip from '../../MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import Markdown from '../../Markdown';
 import { QuoteList } from './QuoteModal';
 import { DatasetSearchModeMap } from '@fastgpt/global/core/dataset/constants';
 import { formatNumber } from '@fastgpt/global/common/math/tools';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 function RowRender({
   children,
@@ -22,10 +22,10 @@ function RowRender({
 }: { children: React.ReactNode; label: string } & BoxProps) {
   return (
     <Box mb={3}>
-      <Box fontSize={['sm', 'md']} mb={mb} flex={'0 0 90px'}>
+      <Box fontSize={'sm'} mb={mb} flex={'0 0 90px'}>
         {label}:
       </Box>
-      <Box borderRadius={'sm'} fontSize={'sm'} bg={'myGray.50'} {...props}>
+      <Box borderRadius={'sm'} fontSize={['xs', 'sm']} bg={'myGray.50'} {...props}>
         {children}
       </Box>
     </Box>
@@ -98,9 +98,7 @@ const WholeResponseModal = ({
       title={
         <Flex alignItems={'center'}>
           {t('core.chat.response.Complete Response')}
-          <MyTooltip label={'从左往右，为各个模块的响应顺序'}>
-            <QuestionOutlineIcon ml={2} />
-          </MyTooltip>
+          <QuestionTip ml={2} label={'从左往右，为各个模块的响应顺序'}></QuestionTip>
         </Flex>
       }
     >
diff --git a/projects/app/src/components/ChatBox/index.tsx b/projects/app/src/components/ChatBox/index.tsx
index fc1e568c8..f0a81df81 100644
--- a/projects/app/src/components/ChatBox/index.tsx
+++ b/projects/app/src/components/ChatBox/index.tsx
@@ -32,7 +32,7 @@ import {
 } from '@/web/core/chat/api';
 import type { AdminMarkType } from './components/SelectMarkCollection';
 
-import MyTooltip from '../MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 
 import { postQuestionGuide } from '@/web/core/ai/api';
 import type {
diff --git a/projects/app/src/components/Layout/navbar.tsx b/projects/app/src/components/Layout/navbar.tsx
index aed0aff0c..6ea1cda7f 100644
--- a/projects/app/src/components/Layout/navbar.tsx
+++ b/projects/app/src/components/Layout/navbar.tsx
@@ -10,7 +10,7 @@ import Avatar from '../Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
-import MyTooltip from '../MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { getDocPath } from '@/web/common/system/doc';
 
 export enum NavbarTypeEnum {
diff --git a/projects/app/src/components/Markdown/chat/QuestionGuide.tsx b/projects/app/src/components/Markdown/chat/QuestionGuide.tsx
index a955048d2..91b0c8b58 100644
--- a/projects/app/src/components/Markdown/chat/QuestionGuide.tsx
+++ b/projects/app/src/components/Markdown/chat/QuestionGuide.tsx
@@ -4,7 +4,7 @@ import 'katex/dist/katex.min.css';
 import ChatBoxDivider from '@/components/core/chat/Divider';
 import { useTranslation } from 'next-i18next';
 import { EventNameEnum, eventBus } from '@/web/common/utils/eventbus';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 
 const QuestionGuide = ({ text }: { text: string }) => {
@@ -31,7 +31,7 @@ const QuestionGuide = ({ text }: { text: string }) => {
             key={text}
             alignItems={'center'}
             flexWrap={'wrap'}
-            fontSize={'sm'}
+            fontSize={'xs'}
             border={theme.borders.sm}
             py={'1px'}
             px={3}
diff --git a/projects/app/src/components/Markdown/index.module.scss b/projects/app/src/components/Markdown/index.module.scss
index 684e63fde..298b34ce5 100644
--- a/projects/app/src/components/Markdown/index.module.scss
+++ b/projects/app/src/components/Markdown/index.module.scss
@@ -105,16 +105,16 @@
   font-size: inherit;
 }
 .markdown h1 {
-  font-size: 28px;
+  font-size: var(--chakra-fontSizes-2xl);
 }
 .markdown h2 {
-  font-size: 24px;
+  font-size: var(--chakra-fontSizes-xl);
 }
 .markdown h3 {
-  font-size: 18px;
+  font-size: var(--chakra-fontSizes-lg);
 }
 .markdown h4 {
-  font-size: 16px;
+  font-size: var(--chakra-fontSizes-md);
 }
 .markdown h5 {
   font-size: 14px;
@@ -346,6 +346,7 @@
   tab-size: 4;
   word-spacing: normal;
   width: 100%;
+  font-size: var(--chakra-fontSizes-sm);
 
   * {
     word-break: break-word;
diff --git a/projects/app/src/components/Markdown/index.tsx b/projects/app/src/components/Markdown/index.tsx
index 7f809755b..9052a4e5d 100644
--- a/projects/app/src/components/Markdown/index.tsx
+++ b/projects/app/src/components/Markdown/index.tsx
@@ -10,7 +10,7 @@ import styles from './index.module.scss';
 import dynamic from 'next/dynamic';
 
 import { Link, Button } from '@chakra-ui/react';
-import MyTooltip from '../MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { EventNameEnum, eventBus } from '@/web/common/utils/eventbus';
 import MyIcon from '@fastgpt/web/components/common/Icon';
diff --git a/projects/app/src/components/MyTooltip/index.tsx b/projects/app/src/components/MyTooltip/index.tsx
deleted file mode 100644
index 8c25d9216..000000000
--- a/projects/app/src/components/MyTooltip/index.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react';
-import { Tooltip, TooltipProps } from '@chakra-ui/react';
-import { useSystemStore } from '@/web/common/system/useSystemStore';
-
-interface Props extends TooltipProps {
-  forceShow?: boolean;
-}
-
-const MyTooltip = ({ children, forceShow = false, shouldWrapChildren = true, ...props }: Props) => {
-  const { isPc } = useSystemStore();
-  return isPc || forceShow ? (
-    <Tooltip
-      className="tooltip"
-      bg={'white'}
-      arrowShadowColor={' rgba(0,0,0,0.05)'}
-      hasArrow
-      arrowSize={12}
-      offset={[-15, 15]}
-      color={'myGray.800'}
-      px={4}
-      py={2}
-      borderRadius={'8px'}
-      whiteSpace={'pre-wrap'}
-      boxShadow={'1px 1px 10px rgba(0,0,0,0.2)'}
-      shouldWrapChildren={shouldWrapChildren}
-      {...props}
-    >
-      {children}
-    </Tooltip>
-  ) : (
-    <>{children}</>
-  );
-};
-
-export default MyTooltip;
diff --git a/projects/app/src/components/PromptTemplate/index.tsx b/projects/app/src/components/PromptTemplate/index.tsx
index 46e38b14f..3a3bd352f 100644
--- a/projects/app/src/components/PromptTemplate/index.tsx
+++ b/projects/app/src/components/PromptTemplate/index.tsx
@@ -37,9 +37,9 @@ const PromptTemplate = ({
                 : {})}
               onClick={() => setSelectTemplateTitle(item)}
             >
-              <Box>{item.title}</Box>
+              <Box color={'myGray.900'}>{item.title}</Box>
 
-              <Box color={'myGray.600'} fontSize={'sm'} whiteSpace={'pre-wrap'}>
+              <Box color={'myGray.500'} fontSize={'xs'} whiteSpace={'pre-wrap'}>
                 {item.desc}
               </Box>
             </Box>
diff --git a/projects/app/src/components/SideTabs/index.tsx b/projects/app/src/components/SideTabs/index.tsx
index 5209c8aeb..ffb7d4628 100644
--- a/projects/app/src/components/SideTabs/index.tsx
+++ b/projects/app/src/components/SideTabs/index.tsx
@@ -17,17 +17,17 @@ const SideTabs = ({ list, size = 'md', activeId, onChange, ...props }: Props) =>
     switch (size) {
       case 'sm':
         return {
-          fontSize: 'sm',
+          fontSize: 'xs',
           inlineP: 1
         };
       case 'md':
         return {
-          fontSize: 'md',
+          fontSize: 'sm',
           inlineP: 2
         };
       case 'lg':
         return {
-          fontSize: 'lg',
+          fontSize: 'md',
           inlineP: 3
         };
     }
@@ -55,7 +55,8 @@ const SideTabs = ({ list, size = 'md', activeId, onChange, ...props }: Props) =>
                 color: 'myGray.600'
               })}
           _hover={{
-            bg: 'myGray.05'
+            color: 'primary.600',
+            bg: 'myGray.100'
           }}
           onClick={() => {
             if (activeId === item.id) return;
diff --git a/projects/app/src/components/Slider/index.tsx b/projects/app/src/components/Slider/index.tsx
index fd53180b0..20b7ab97e 100644
--- a/projects/app/src/components/Slider/index.tsx
+++ b/projects/app/src/components/Slider/index.tsx
@@ -47,7 +47,6 @@ const MySlider = ({
         max={max}
         min={min}
         step={step}
-        size={'lg'}
         value={value}
         width={width}
         onChange={onChange}
diff --git a/projects/app/src/components/Tabs/index.tsx b/projects/app/src/components/Tabs/index.tsx
index 0e03550d7..40a57cfdb 100644
--- a/projects/app/src/components/Tabs/index.tsx
+++ b/projects/app/src/components/Tabs/index.tsx
@@ -18,19 +18,19 @@ const Tabs = ({ list, size = 'md', activeId, onChange, ...props }: Props) => {
     switch (size) {
       case 'sm':
         return {
-          fontSize: 'sm',
+          fontSize: 'xs',
           outP: '3px',
           inlineP: 1
         };
       case 'md':
         return {
-          fontSize: ['sm', 'md'],
+          fontSize: 'sm',
           outP: '4px',
           inlineP: 1
         };
       case 'lg':
         return {
-          fontSize: ['md', 'lg'],
+          fontSize: ['sm', 'md'],
           outP: '5px',
           inlineP: 2
         };
diff --git a/projects/app/src/components/common/MyRadio/index.tsx b/projects/app/src/components/common/MyRadio/index.tsx
index 18d8ce447..207bdc8a4 100644
--- a/projects/app/src/components/common/MyRadio/index.tsx
+++ b/projects/app/src/components/common/MyRadio/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Box, Flex, useTheme, Grid, type GridProps, theme, Image } from '@chakra-ui/react';
+import { Box, Flex, useTheme, Grid, type GridProps, theme, Image, Radio } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
@@ -36,7 +36,7 @@ const MyRadio = ({
   const { toast } = useToast();
 
   return (
-    <Grid gridGap={[3, 5]} fontSize={['sm', 'md']} {...props}>
+    <Grid gridGap={[3, 5]} {...props}>
       {list.map((item) => (
         <Flex
           key={item.value}
@@ -44,8 +44,7 @@ const MyRadio = ({
           cursor={'pointer'}
           userSelect={'none'}
           py={3}
-          pl={'14px'}
-          pr={hiddenCircle ? '14px' : '36px'}
+          px={'4'}
           p={p !== undefined ? `${p} !important` : undefined}
           border={theme.borders.sm}
           borderWidth={'1.5px'}
@@ -62,27 +61,6 @@ const MyRadio = ({
                   borderColor: 'primary.400'
                 }
               })}
-          _after={{
-            content: '""',
-            display: hiddenCircle ? 'none' : 'block',
-            position: 'absolute',
-            right: '14px',
-            w: '16px',
-            h: '16px',
-            mr: 1,
-            borderRadius: '16px',
-            transition: '0.2s',
-            boxSizing: 'border-box',
-            ...(value === item.value
-              ? {
-                  border: '5px solid',
-                  borderColor: 'primary.600'
-                }
-              : {
-                  border: '2px solid',
-                  borderColor: 'myGray.200'
-                })
-          }}
           onClick={() => {
             if (item.forbidTip) {
               toast({
@@ -103,14 +81,17 @@ const MyRadio = ({
               )}
             </>
           )}
-          <Box pr={hiddenCircle ? 0 : 2} color={'myGray.800'}>
-            <Box>{typeof item.title === 'string' ? t(item.title) : item.title}</Box>
+          <Box pr={hiddenCircle ? 0 : 2} flex={'1 0 0'}>
+            <Box fontSize={'sm'} color={'myGray.800'}>
+              {typeof item.title === 'string' ? t(item.title) : item.title}
+            </Box>
             {!!item.desc && (
-              <Box fontSize={'xs'} color={'myGray.500'} lineHeight={1.2}>
+              <Box fontSize={'mini'} color={'myGray.500'} lineHeight={1.2}>
                 {t(item.desc)}
               </Box>
             )}
           </Box>
+          <Radio isChecked={value === item.value} />
         </Flex>
       ))}
     </Grid>
diff --git a/projects/app/src/components/common/ParentPaths/index.tsx b/projects/app/src/components/common/ParentPaths/index.tsx
index b18d24ee4..31b4fe137 100644
--- a/projects/app/src/components/common/ParentPaths/index.tsx
+++ b/projects/app/src/components/common/ParentPaths/index.tsx
@@ -37,7 +37,7 @@ const ParentPaths = (props: {
       {concatPaths.map((item, i) => (
         <Flex key={item.parentId || i} alignItems={'center'}>
           <Box
-            fontSize={['sm', fontSize || 'lg']}
+            fontSize={['sm', fontSize || 'md']}
             py={1}
             px={[1, 2]}
             borderRadius={'md'}
diff --git a/projects/app/src/components/common/Rowtabs/index.tsx b/projects/app/src/components/common/Rowtabs/index.tsx
index c4be6631e..30ee7f763 100644
--- a/projects/app/src/components/common/Rowtabs/index.tsx
+++ b/projects/app/src/components/common/Rowtabs/index.tsx
@@ -38,7 +38,7 @@ const RowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props }: P
               })}
         >
           {item.icon && <MyIcon name={item.icon as any} mr={1} w={'14px'} />}
-          <Box>{item.label}</Box>
+          <Box fontSize={'sm'}>{item.label}</Box>
         </Flex>
       ))}
     </Box>
diff --git a/projects/app/src/components/common/Textarea/MyTextarea/index.tsx b/projects/app/src/components/common/Textarea/MyTextarea/index.tsx
index 5553c55dd..0566b8d8c 100644
--- a/projects/app/src/components/common/Textarea/MyTextarea/index.tsx
+++ b/projects/app/src/components/common/Textarea/MyTextarea/index.tsx
@@ -9,7 +9,7 @@ import {
   TextareaProps,
   useDisclosure
 } from '@chakra-ui/react';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyModal from '@fastgpt/web/components/common/MyModal';
diff --git a/projects/app/src/components/core/ai/AISettingModal/index.tsx b/projects/app/src/components/core/ai/AISettingModal/index.tsx
index a31a95874..709e3e3f2 100644
--- a/projects/app/src/components/core/ai/AISettingModal/index.tsx
+++ b/projects/app/src/components/core/ai/AISettingModal/index.tsx
@@ -19,8 +19,6 @@ import type { SettingAIDataType } from '@fastgpt/global/core/app/type.d';
 import { getDocPath } from '@/web/common/system/doc';
 import AIModelSelector from '@/components/Select/AIModelSelector';
 import { LLMModelItemType } from '@fastgpt/global/core/ai/model.d';
-import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const AIChatSettingsModal = ({
@@ -65,7 +63,8 @@ const AIChatSettingsModal = ({
   const LabelStyles: BoxProps = {
     display: 'flex',
     alignItems: 'center',
-    fontSize: ['sm', 'md'],
+    fontSize: 'sm',
+    color: 'myGray.900',
     width: ['80px', '90px']
   };
 
@@ -209,14 +208,14 @@ const AIChatSettingsModal = ({
           <Flex mt={8} alignItems={'center'}>
             <Box {...LabelStyles}>
               {t('core.app.Ai response')}
-              <MyTooltip label={t('core.module.template.AI response switch tip')}>
-                <QuestionOutlineIcon ml={1} />
-              </MyTooltip>
+              <QuestionTip
+                ml={1}
+                label={t('core.module.template.AI response switch tip')}
+              ></QuestionTip>
             </Box>
             <Box flex={1} ml={'10px'}>
               <Switch
                 isChecked={getValues(NodeInputKeyEnum.aiChatIsResponseText)}
-                size={'lg'}
                 onChange={(e) => {
                   const value = e.target.checked;
                   setValue(NodeInputKeyEnum.aiChatIsResponseText, value);
diff --git a/projects/app/src/components/core/app/DatasetParamsModal.tsx b/projects/app/src/components/core/app/DatasetParamsModal.tsx
index 25ec5655e..2326b6bcd 100644
--- a/projects/app/src/components/core/app/DatasetParamsModal.tsx
+++ b/projects/app/src/components/core/app/DatasetParamsModal.tsx
@@ -12,9 +12,8 @@ import {
   useTheme
 } from '@chakra-ui/react';
 import { useForm } from 'react-hook-form';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import MySlider from '@/components/Slider';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { DatasetSearchModeEnum } from '@fastgpt/global/core/dataset/constants';
 import { useTranslation } from 'next-i18next';
@@ -29,6 +28,8 @@ import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import SelectAiModel from '@/components/Select/AIModelSelector';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 export type DatasetParamsProps = {
   searchMode: `${DatasetSearchModeEnum}`;
@@ -158,8 +159,7 @@ const DatasetParamsModal = ({
                 cursor={'pointer'}
                 userSelect={'none'}
                 py={3}
-                pl={'14px'}
-                pr={'16px'}
+                px={4}
                 border={theme.borders.sm}
                 borderWidth={'1.5px'}
                 borderRadius={'md'}
@@ -191,8 +191,8 @@ const DatasetParamsModal = ({
               >
                 <MyIcon name="core/dataset/rerank" w={'18px'} mr={'14px'} />
                 <Box pr={2} color={'myGray.800'} flex={'1 0 0'}>
-                  <Box>{t('core.dataset.search.ReRank')}</Box>
-                  <Box fontSize={['xs', 'sm']} color={'myGray.500'}>
+                  <Box fontSize={'sm'}>{t('core.dataset.search.ReRank')}</Box>
+                  <Box fontSize={'xs'} color={'myGray.500'}>
                     {t('core.dataset.search.ReRank desc')}
                   </Box>
                 </Box>
@@ -208,12 +208,13 @@ const DatasetParamsModal = ({
           <Box pt={5}>
             {limit !== undefined && (
               <Box display={['block', 'flex']}>
-                <Box flex={'0 0 120px'} mb={[8, 0]}>
-                  {t('core.dataset.search.Max Tokens')}
-                  <MyTooltip label={t('core.dataset.search.Max Tokens Tips')} forceShow>
-                    <QuestionOutlineIcon ml={1} />
-                  </MyTooltip>
-                </Box>
+                <Flex flex={'0 0 120px'} mb={[8, 0]}>
+                  <FormLabel>{t('core.dataset.search.Max Tokens')}</FormLabel>
+                  <QuestionTip
+                    ml={1}
+                    label={t('core.dataset.search.Max Tokens Tips')}
+                  ></QuestionTip>
+                </Flex>
                 <Box flex={1} mx={4}>
                   <MySlider
                     markList={[
@@ -233,12 +234,13 @@ const DatasetParamsModal = ({
               </Box>
             )}
             <Box display={['block', 'flex']} mt={10}>
-              <Box flex={'0 0 120px'} mb={[8, 0]}>
-                {t('core.dataset.search.Min Similarity')}
-                <MyTooltip label={t('core.dataset.search.Min Similarity Tips')} forceShow>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
-              </Box>
+              <Flex flex={'0 0 120px'} mb={[8, 0]}>
+                <FormLabel>{t('core.dataset.search.Min Similarity')}</FormLabel>
+                <QuestionTip
+                  ml={1}
+                  label={t('core.dataset.search.Min Similarity Tips')}
+                ></QuestionTip>
+              </Flex>
               <Box flex={1} mx={4}>
                 {showSimilarity ? (
                   <MySlider
@@ -264,7 +266,7 @@ const DatasetParamsModal = ({
         )}
         {currentTabType === SearchSettingTabEnum.queryExtension && (
           <Box>
-            <Box fontSize={'xs'} color={'myGray.500'}>
+            <Box transform={'translateY(-5px)'} fontSize={'xs'} color={'myGray.500'}>
               {t('core.dataset.Query extension intro')}
             </Box>
             <Flex mt={3} alignItems={'center'}>
@@ -274,8 +276,8 @@ const DatasetParamsModal = ({
             {datasetSearchUsingCfrForm === true && (
               <>
                 <Flex mt={4} alignItems={'center'}>
-                  <Box flex={'0 0 100px'}>{t('core.ai.Model')}</Box>
-                  <Box flex={'1 0 0'}>
+                  <FormLabel flex={['0 0 80px', '1 0 0']}>{t('core.ai.Model')}</FormLabel>
+                  <Box flex={['1 0 0', '0 0 300px']}>
                     <SelectAiModel
                       width={'100%'}
                       value={queryExtensionModel}
@@ -288,10 +290,11 @@ const DatasetParamsModal = ({
                 </Flex>
                 <Box mt={3}>
                   <Flex alignItems={'center'}>
-                    {t('core.app.edit.Query extension background prompt')}
-                    <MyTooltip label={t('core.app.edit.Query extension background tip')} forceShow>
-                      <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-                    </MyTooltip>
+                    <FormLabel>{t('core.app.edit.Query extension background prompt')}</FormLabel>
+                    <QuestionTip
+                      ml={1}
+                      label={t('core.app.edit.Query extension background tip')}
+                    ></QuestionTip>
                   </Flex>
                   <Box mt={1}>
                     <PromptEditor
diff --git a/projects/app/src/components/core/app/DatasetSelectModal.tsx b/projects/app/src/components/core/app/DatasetSelectModal.tsx
index ebe00353b..6c4d0eeeb 100644
--- a/projects/app/src/components/core/app/DatasetSelectModal.tsx
+++ b/projects/app/src/components/core/app/DatasetSelectModal.tsx
@@ -13,7 +13,7 @@ import {
 import Avatar from '@/components/Avatar';
 import type { SelectedDatasetType } from '@fastgpt/global/core/workflow/api.d';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { useTranslation } from 'next-i18next';
@@ -163,7 +163,7 @@ export const DatasetSelectModal = ({
                           className="textEllipsis"
                           ml={3}
                           fontWeight={'bold'}
-                          fontSize={['md', 'lg', 'xl']}
+                          fontSize={['md', 'lg']}
                         >
                           {item.name}
                         </Box>
diff --git a/projects/app/src/components/core/app/InputGuideConfig.tsx b/projects/app/src/components/core/app/InputGuideConfig.tsx
index b84ba7e99..a0b1b10cf 100644
--- a/projects/app/src/components/core/app/InputGuideConfig.tsx
+++ b/projects/app/src/components/core/app/InputGuideConfig.tsx
@@ -1,5 +1,5 @@
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import {
   Box,
   Button,
@@ -34,10 +34,10 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { readCsvRawText } from '@fastgpt/web/common/file/utils';
 import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
-import { useRequest } from 'ahooks';
 import HighlightText from '@fastgpt/web/components/common/String/HighlightText';
 import { defaultChatInputGuideConfig } from '@fastgpt/global/core/app/constants';
 import ChatFunctionTip from './Tip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const csvTemplate = `"第一列内容"
 "只会将第一列内容导入，其余列会被忽略"
@@ -85,10 +85,10 @@ const InputGuideConfig = ({
   return (
     <Flex alignItems={'center'}>
       <MyIcon name={'core/app/inputGuides'} mr={2} w={'20px'} />
-      <HStack>
-        <Box>{chatT('Input guide')}</Box>
+      <Flex alignItems={'center'}>
+        <FormLabel>{chatT('Input guide')}</FormLabel>
         <ChatFunctionTip type={'inputGuide'} />
-      </HStack>
+      </Flex>
       <Box flex={1} />
       <MyTooltip label={chatT('Config input guide')}>
         <Button
@@ -109,10 +109,9 @@ const InputGuideConfig = ({
       >
         <ModalBody px={[5, 16]} py={[4, 8]} w={'500px'}>
           <Flex justifyContent={'space-between'} alignItems={'center'}>
-            {t('Is open')}
+            <FormLabel>{t('Is open')}</FormLabel>
             <Switch
               isChecked={isOpenQuestionGuide}
-              size={'lg'}
               onChange={(e) => {
                 onChange({
                   ...value,
@@ -124,7 +123,7 @@ const InputGuideConfig = ({
           {isOpenQuestionGuide && (
             <>
               <Flex mt={8} alignItems={'center'}>
-                {chatT('Input guide lexicon')}
+                <FormLabel>{chatT('Input guide lexicon')}</FormLabel>
                 <Box fontSize={'xs'} px={2} bg={'myGray.100'} ml={1} rounded={'full'}>
                   {total}
                 </Box>
@@ -142,7 +141,7 @@ const InputGuideConfig = ({
               </Flex>
               <>
                 <Flex mt={8} alignItems={'center'}>
-                  {chatT('Custom input guide url')}
+                  <FormLabel>{chatT('Custom input guide url')}</FormLabel>
                   <Flex
                     onClick={() => window.open(getDocPath('/docs/course/chat_input_guide'))}
                     color={'primary.700'}
@@ -203,7 +202,7 @@ const LexiconConfigModal = ({ appId, onClose }: { appId: string; onClose: () =>
     refreshDeps: [searchKey],
     debounceWait: 300,
 
-    itemHeight: 46,
+    itemHeight: 48,
     overscan: 20,
 
     pageSize: 20,
@@ -381,6 +380,7 @@ const LexiconConfigModal = ({ appId, onClose }: { appId: string; onClose: () =>
       <ScrollList
         px={8}
         flex={'1 0 0'}
+        fontSize={'sm'}
         EmptyChildren={<EmptyTip text={chatT('Chat input guide lexicon is empty')} />}
       >
         {list.map((data, index) => {
@@ -394,7 +394,7 @@ const LexiconConfigModal = ({ appId, onClose }: { appId: string; onClose: () =>
               key={index}
               alignItems={'center'}
               h={10}
-              mt={3}
+              mt={2}
               _hover={{
                 '& .icon-list': {
                   display: 'flex'
@@ -402,7 +402,6 @@ const LexiconConfigModal = ({ appId, onClose }: { appId: string; onClose: () =>
               }}
             >
               <Checkbox
-                size={'lg'}
                 mr={2}
                 isChecked={selected}
                 onChange={(e) => {
diff --git a/projects/app/src/components/core/app/QGSwitch.tsx b/projects/app/src/components/core/app/QGSwitch.tsx
index 0d2ca8cde..c27e7d07e 100644
--- a/projects/app/src/components/core/app/QGSwitch.tsx
+++ b/projects/app/src/components/core/app/QGSwitch.tsx
@@ -3,6 +3,7 @@ import { Box, Flex, Switch, type SwitchProps } from '@chakra-ui/react';
 import React from 'react';
 import { useTranslation } from 'next-i18next';
 import ChatFunctionTip from './Tip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 // question generator switch
 const QGSwitch = (props: SwitchProps) => {
@@ -10,7 +11,7 @@ const QGSwitch = (props: SwitchProps) => {
   return (
     <Flex alignItems={'center'}>
       <MyIcon name={'core/chat/QGFill'} mr={2} w={'20px'} />
-      <Box fontWeight={'medium'}>{t('core.app.Question Guide')}</Box>
+      <FormLabel>{t('core.app.Question Guide')}</FormLabel>
       <ChatFunctionTip type={'nextQuestion'} />
       <Box flex={1} />
       <Switch {...props} />
diff --git a/projects/app/src/components/core/app/ScheduledTriggerConfig.tsx b/projects/app/src/components/core/app/ScheduledTriggerConfig.tsx
index 6c8b06539..2ef46f1ef 100644
--- a/projects/app/src/components/core/app/ScheduledTriggerConfig.tsx
+++ b/projects/app/src/components/core/app/ScheduledTriggerConfig.tsx
@@ -1,4 +1,13 @@
-import { Box, Button, Flex, ModalBody, useDisclosure, Switch, Textarea } from '@chakra-ui/react';
+import {
+  Box,
+  Button,
+  Flex,
+  ModalBody,
+  useDisclosure,
+  Switch,
+  Textarea,
+  HStack
+} from '@chakra-ui/react';
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
@@ -10,6 +19,7 @@ import dynamic from 'next/dynamic';
 import type { MultipleSelectProps } from '@fastgpt/web/components/common/MySelect/type.d';
 import { cronParser2Fields } from '@fastgpt/global/common/string/time';
 import TimezoneSelect from '@fastgpt/web/components/common/MySelect/TimezoneSelect';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const MultipleRowSelect = dynamic(
   () => import('@fastgpt/web/components/common/MySelect/MultipleRowSelect')
@@ -135,7 +145,7 @@ const ScheduledTriggerConfig = ({
       defaultPrompt?: string;
     }) => {
       onChange({
-        cronString: cronString ?? value?.cronString ?? '0 0 * * *',
+        cronString: cronString ?? value?.cronString ?? '',
         timezone: timezone ?? value?.timezone ?? Intl.DateTimeFormat().resolvedOptions().timeZone,
         defaultPrompt: defaultPrompt ?? value?.defaultPrompt ?? ''
       });
@@ -243,10 +253,10 @@ const ScheduledTriggerConfig = ({
       <>
         <Flex alignItems={'center'}>
           <MyIcon name={'core/app/schedulePlan'} w={'20px'} />
-          <Flex alignItems={'center'} ml={2} flex={1}>
-            {t('core.app.Interval timer run')}
-            <QuestionTip ml={1} label={t('core.app.Interval timer tip')} />
-          </Flex>
+          <HStack ml={2} flex={1} spacing={1}>
+            <FormLabel>{t('core.app.Interval timer run')}</FormLabel>
+            <QuestionTip label={t('core.app.Interval timer tip')} />
+          </HStack>
           <MyTooltip label={t('core.app.Config schedule plan')}>
             <Button
               variant={'transparentBase'}
@@ -269,9 +279,8 @@ const ScheduledTriggerConfig = ({
         >
           <ModalBody>
             <Flex justifyContent={'space-between'} alignItems={'center'}>
-              <Box flex={'0 0 80px'}> {t('core.app.schedule.Open schedule')}</Box>
+              <FormLabel flex={'0 0 80px'}> {t('core.app.schedule.Open schedule')}</FormLabel>
               <Switch
-                size={'lg'}
                 isChecked={isOpenSchedule}
                 onChange={(e) => {
                   if (e.target.checked) {
@@ -285,7 +294,7 @@ const ScheduledTriggerConfig = ({
             {isOpenSchedule && (
               <>
                 <Flex alignItems={'center'} mt={5}>
-                  <Box flex={'0 0 80px'}>执行时机</Box>
+                  <FormLabel flex={'0 0 80px'}>执行时间</FormLabel>
                   <Box flex={'1 0 0'}>
                     <MultipleRowSelect
                       label={formatLabel}
@@ -298,7 +307,7 @@ const ScheduledTriggerConfig = ({
                   </Box>
                 </Flex>
                 <Flex alignItems={'center'} mt={5}>
-                  <Box flex={'0 0 80px'}>时区</Box>
+                  <FormLabel flex={'0 0 80px'}>时区</FormLabel>
                   <Box flex={'1 0 0'}>
                     <TimezoneSelect
                       value={timezone}
@@ -309,7 +318,7 @@ const ScheduledTriggerConfig = ({
                   </Box>
                 </Flex>
                 <Box mt={5}>
-                  <Box mb={1}>{t('core.app.schedule.Default prompt')}</Box>
+                  <FormLabel mb={1}>{t('core.app.schedule.Default prompt')}</FormLabel>
                   <Textarea
                     value={defaultPrompt}
                     rows={8}
diff --git a/projects/app/src/components/core/app/TTSSelect.tsx b/projects/app/src/components/core/app/TTSSelect.tsx
index e2c09dac4..42bc2b551 100644
--- a/projects/app/src/components/core/app/TTSSelect.tsx
+++ b/projects/app/src/components/core/app/TTSSelect.tsx
@@ -1,5 +1,5 @@
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { Box, Button, Flex, ModalBody, useDisclosure, Image } from '@chakra-ui/react';
 import React, { useCallback, useMemo } from 'react';
 import { useTranslation } from 'next-i18next';
@@ -12,6 +12,7 @@ import MySlider from '@/components/Slider';
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import { defaultTTSConfig } from '@fastgpt/global/core/app/constants';
 import ChatFunctionTip from './Tip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const TTSSelect = ({
   value = defaultTTSConfig,
@@ -81,7 +82,7 @@ const TTSSelect = ({
   return (
     <Flex alignItems={'center'}>
       <MyIcon name={'core/app/simpleMode/tts'} mr={2} w={'20px'} />
-      <Box fontWeight={'medium'}>{t('core.app.TTS')}</Box>
+      <FormLabel>{t('core.app.TTS')}</FormLabel>
       <ChatFunctionTip type={'tts'} />
       <Box flex={1} />
       <MyTooltip label={t('core.app.Select TTS')}>
@@ -108,11 +109,11 @@ const TTSSelect = ({
       >
         <ModalBody px={[5, 16]} py={[4, 8]}>
           <Flex justifyContent={'space-between'} alignItems={'center'}>
-            {t('core.app.tts.Speech model')}
+            <FormLabel>{t('core.app.tts.Speech model')}</FormLabel>
             <MySelect w={'220px'} value={formatValue} list={list} onchange={onclickChange} />
           </Flex>
           <Flex mt={8} justifyContent={'space-between'}>
-            {t('core.app.tts.Speech speed')}
+            <FormLabel>{t('core.app.tts.Speech speed')}</FormLabel>
             <MySlider
               markList={[
                 { label: '0.3', value: 0.3 },
diff --git a/projects/app/src/components/core/app/Tip.tsx b/projects/app/src/components/core/app/Tip.tsx
index 62b775001..ad1b0c933 100644
--- a/projects/app/src/components/core/app/Tip.tsx
+++ b/projects/app/src/components/core/app/Tip.tsx
@@ -65,7 +65,7 @@ const ChatFunctionTip = ({ type }: { type: `${FnTypeEnum}` }) => {
               </Box>
             </Box>
           </Flex>
-          <Image src={data.imgUrl} w={'100%'} minH={['auto', '200px']} mt={2} alt={''} />
+          <Image src={data.imgUrl} w={'100%'} minH={['auto', '250px']} mt={2} alt={''} />
         </Box>
       }
     />
diff --git a/projects/app/src/components/core/app/VariableEdit.tsx b/projects/app/src/components/core/app/VariableEdit.tsx
index bfbb7f83c..e14a40278 100644
--- a/projects/app/src/components/core/app/VariableEdit.tsx
+++ b/projects/app/src/components/core/app/VariableEdit.tsx
@@ -22,7 +22,7 @@ import {
   TableContainer,
   useDisclosure
 } from '@chakra-ui/react';
-import { QuestionOutlineIcon, SmallAddIcon } from '@chakra-ui/icons';
+import { SmallAddIcon } from '@chakra-ui/icons';
 import { VariableInputEnum, variableMap } from '@fastgpt/global/core/workflow/constants';
 import type { VariableItemType } from '@fastgpt/global/core/app/type.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
@@ -31,12 +31,12 @@ import { useFieldArray } from 'react-hook-form';
 import { customAlphabet } from 'nanoid';
 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 6);
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import MyTooltip from '@/components/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import MyRadio from '@/components/common/MyRadio';
 import { formatEditorVariablePickerIcon } from '@fastgpt/global/core/workflow/utils';
 import ChatFunctionTip from './Tip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const VariableEdit = ({
   variables = [],
@@ -96,9 +96,9 @@ const VariableEdit = ({
     <Box>
       <Flex alignItems={'center'}>
         <MyIcon name={'core/app/simpleMode/variable'} w={'20px'} />
-        <Box ml={2} fontWeight={'medium'}>
+        <FormLabel ml={2} fontWeight={'medium'}>
           {t('core.module.Variable')}
-        </Box>
+        </FormLabel>
         <ChatFunctionTip type={'variable'} />
         <Box flex={1} />
         <Button
@@ -118,14 +118,19 @@ const VariableEdit = ({
       {formatVariables.length > 0 && (
         <Box mt={2} borderRadius={'md'} overflow={'hidden'} borderWidth={'1px'} borderBottom="none">
           <TableContainer>
-            <Table bg={'white'}>
+            <Table>
               <Thead>
-                <Tr bg={'myGray.50'}>
-                  <Th w={'18px !important'} p={0} />
-                  <Th>{t('core.module.variable.variable name')}</Th>
-                  <Th>{t('core.module.variable.key')}</Th>
-                  <Th>{t('common.Require Input')}</Th>
-                  <Th></Th>
+                <Tr>
+                  <Th
+                    fontSize={'mini'}
+                    borderRadius={'none !important'}
+                    w={'18px !important'}
+                    p={0}
+                  />
+                  <Th fontSize={'mini'}>{t('core.module.variable.variable name')}</Th>
+                  <Th fontSize={'mini'}>{t('core.module.variable.key')}</Th>
+                  <Th fontSize={'mini'}>{t('common.Require Input')}</Th>
+                  <Th fontSize={'mini'} borderRadius={'none !important'}></Th>
                 </Tr>
               </Thead>
               <Tbody>
@@ -174,12 +179,12 @@ const VariableEdit = ({
         <ModalBody>
           {variableType !== VariableInputEnum.custom && (
             <Flex alignItems={'center'}>
-              <Box w={'70px'}>{t('common.Require Input')}</Box>
+              <FormLabel w={'70px'}>{t('common.Require Input')}</FormLabel>
               <Switch {...registerEdit('variable.required')} />
             </Flex>
           )}
           <Flex mt={5} alignItems={'center'}>
-            <Box w={'80px'}>{t('core.module.variable.variable name')}</Box>
+            <FormLabel w={'80px'}>{t('core.module.variable.variable name')}</FormLabel>
             <Input
               {...registerEdit('variable.label', {
                 required: t('core.module.variable.variable name is required')
@@ -187,7 +192,7 @@ const VariableEdit = ({
             />
           </Flex>
           <Flex mt={5} alignItems={'center'}>
-            <Box w={'80px'}>{t('core.module.variable.key')}</Box>
+            <FormLabel w={'80px'}>{t('core.module.variable.key')}</FormLabel>
             <Input
               {...registerEdit('variable.key', {
                 required: t('core.module.variable.key is required')
@@ -195,9 +200,9 @@ const VariableEdit = ({
             />
           </Flex>
 
-          <Box mt={5} mb={2}>
+          <FormLabel mt={5} mb={2}>
             {t('core.workflow.Variable.Variable type')}
-          </Box>
+          </FormLabel>
           <MyRadio
             gridGap={4}
             gridTemplateColumns={'repeat(2,1fr)'}
@@ -220,9 +225,9 @@ const VariableEdit = ({
 
           {variableType === VariableInputEnum.input && (
             <>
-              <Box mt={5} mb={2}>
+              <FormLabel mt={5} mb={2}>
                 {t('core.module.variable.text max length')}
-              </Box>
+              </FormLabel>
               <Box>
                 <NumberInput max={500} min={1} step={1} position={'relative'}>
                   <NumberInputField
diff --git a/projects/app/src/components/core/app/WelcomeTextConfig.tsx b/projects/app/src/components/core/app/WelcomeTextConfig.tsx
index f3a84107f..fbe525f85 100644
--- a/projects/app/src/components/core/app/WelcomeTextConfig.tsx
+++ b/projects/app/src/components/core/app/WelcomeTextConfig.tsx
@@ -4,6 +4,7 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import ChatFunctionTip from './Tip';
 import MyTextarea from '@/components/common/Textarea/MyTextarea';
 import { useTranslation } from 'next-i18next';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const WelcomeTextConfig = (props: TextareaProps) => {
   const { t } = useTranslation();
@@ -11,7 +12,7 @@ const WelcomeTextConfig = (props: TextareaProps) => {
     <>
       <Flex alignItems={'center'}>
         <MyIcon name={'core/app/simpleMode/chat'} w={'20px'} />
-        <Box ml={2}>{t('core.app.Welcome Text')}</Box>
+        <FormLabel ml={2}>{t('core.app.Welcome Text')}</FormLabel>
         <ChatFunctionTip type={'welcome'} />
       </Flex>
       <MyTextarea
diff --git a/projects/app/src/components/core/app/WhisperConfig.tsx b/projects/app/src/components/core/app/WhisperConfig.tsx
index b458f9ec1..2e9aa851a 100644
--- a/projects/app/src/components/core/app/WhisperConfig.tsx
+++ b/projects/app/src/components/core/app/WhisperConfig.tsx
@@ -1,5 +1,5 @@
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { Box, Button, Flex, ModalBody, useDisclosure, Switch } from '@chakra-ui/react';
 import React, { useMemo } from 'react';
 import { useTranslation } from 'next-i18next';
@@ -7,6 +7,7 @@ import type { AppWhisperConfigType } from '@fastgpt/global/core/app/type.d';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 import { defaultWhisperConfig } from '@fastgpt/global/core/app/constants';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const WhisperConfig = ({
   isOpenAudio,
@@ -33,7 +34,7 @@ const WhisperConfig = ({
   return (
     <Flex alignItems={'center'}>
       <MyIcon name={'core/app/simpleMode/whisper'} mr={2} w={'20px'} />
-      <Box fontWeight={'medium'}>{t('core.app.Whisper')}</Box>
+      <FormLabel>{t('core.app.Whisper')}</FormLabel>
       <Box flex={1} />
       <MyTooltip label={t('core.app.Config whisper')}>
         <Button
@@ -54,10 +55,9 @@ const WhisperConfig = ({
       >
         <ModalBody px={[5, 16]} py={[4, 8]}>
           <Flex justifyContent={'space-between'} alignItems={'center'}>
-            {t('core.app.whisper.Switch')}
+            <FormLabel>{t('core.app.whisper.Switch')}</FormLabel>
             <Switch
               isChecked={isOpenWhisper}
-              size={'lg'}
               onChange={(e) => {
                 onChange({
                   ...value,
@@ -68,12 +68,11 @@ const WhisperConfig = ({
           </Flex>
           {isOpenWhisper && (
             <Flex mt={8} alignItems={'center'}>
-              {t('core.app.whisper.Auto send')}
+              <FormLabel>{t('core.app.whisper.Auto send')}</FormLabel>
               <QuestionTip label={t('core.app.whisper.Auto send tip')} />
               <Box flex={'1 0 0'} />
               <Switch
                 isChecked={value.autoSend}
-                size={'lg'}
                 onChange={(e) => {
                   onChange({
                     ...value,
@@ -86,12 +85,11 @@ const WhisperConfig = ({
           {isOpenWhisper && isAutoSend && (
             <>
               <Flex mt={8} alignItems={'center'}>
-                {t('core.app.whisper.Auto tts response')}
+                <FormLabel>{t('core.app.whisper.Auto tts response')}</FormLabel>
                 <QuestionTip label={t('core.app.whisper.Auto tts response tip')} />
                 <Box flex={'1 0 0'} />
                 <Switch
                   isChecked={value.autoTTSResponse}
-                  size={'lg'}
                   onChange={(e) => {
                     onChange({
                       ...value,
diff --git a/projects/app/src/components/core/dataset/QuoteItem.tsx b/projects/app/src/components/core/dataset/QuoteItem.tsx
index b7c3dfdc3..980c18312 100644
--- a/projects/app/src/components/core/dataset/QuoteItem.tsx
+++ b/projects/app/src/components/core/dataset/QuoteItem.tsx
@@ -5,7 +5,7 @@ import type { SearchDataResponseItemType } from '@fastgpt/global/core/dataset/ty
 import NextLink from 'next/link';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import dynamic from 'next/dynamic';
 import MyBox from '@fastgpt/web/components/common/MyBox';
 import { SearchScoreTypeEnum, SearchScoreTypeMap } from '@fastgpt/global/core/dataset/constants';
diff --git a/projects/app/src/components/core/dataset/RawSourceBox.tsx b/projects/app/src/components/core/dataset/RawSourceBox.tsx
index 21e5732e2..309e5276c 100644
--- a/projects/app/src/components/core/dataset/RawSourceBox.tsx
+++ b/projects/app/src/components/core/dataset/RawSourceBox.tsx
@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 import { Box, BoxProps } from '@chakra-ui/react';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { getCollectionSourceAndOpen } from '@/web/core/dataset/hooks/readCollectionSource';
 import { getSourceNameIcon } from '@fastgpt/global/core/dataset/utils';
diff --git a/projects/app/src/components/core/dataset/SearchParamsTip.tsx b/projects/app/src/components/core/dataset/SearchParamsTip.tsx
index 04c7eb225..337d8e539 100644
--- a/projects/app/src/components/core/dataset/SearchParamsTip.tsx
+++ b/projects/app/src/components/core/dataset/SearchParamsTip.tsx
@@ -39,13 +39,15 @@ const SearchParamsTip = ({
     >
       <Table fontSize={'xs'} overflow={'overlay'}>
         <Thead>
-          <Tr color={'myGray.600'}>
-            <Th>{t('core.dataset.search.search mode')}</Th>
-            <Th>{t('core.dataset.search.Max Tokens')}</Th>
-            <Th>{t('core.dataset.search.Min Similarity')}</Th>
-            {hasReRankModel && <Th>{t('core.dataset.search.ReRank')}</Th>}
-            <Th>{t('core.module.template.Query extension')}</Th>
-            {hasEmptyResponseMode && <Th>{t('core.dataset.search.Empty result response')}</Th>}
+          <Tr bg={'transparent !important'}>
+            <Th fontSize={'mini'}>{t('core.dataset.search.search mode')}</Th>
+            <Th fontSize={'mini'}>{t('core.dataset.search.Max Tokens')}</Th>
+            <Th fontSize={'mini'}>{t('core.dataset.search.Min Similarity')}</Th>
+            {hasReRankModel && <Th fontSize={'mini'}>{t('core.dataset.search.ReRank')}</Th>}
+            <Th fontSize={'mini'}>{t('core.module.template.Query extension')}</Th>
+            {hasEmptyResponseMode && (
+              <Th fontSize={'mini'}>{t('core.dataset.search.Empty result response')}</Th>
+            )}
           </Tr>
         </Thead>
         <Tbody>
diff --git a/projects/app/src/components/core/workflow/Flow/ChatTest.tsx b/projects/app/src/components/core/workflow/Flow/ChatTest.tsx
index 18ff868b2..7b654d5a1 100644
--- a/projects/app/src/components/core/workflow/Flow/ChatTest.tsx
+++ b/projects/app/src/components/core/workflow/Flow/ChatTest.tsx
@@ -12,7 +12,7 @@ import { SmallCloseIcon } from '@chakra-ui/icons';
 import { Box, Flex, IconButton } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { streamFetch } from '@/web/common/api/fetch';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import ChatBox from '@/components/ChatBox';
 import type { ComponentRef, StartChatFnProps } from '@/components/ChatBox/type.d';
@@ -107,7 +107,7 @@ const ChatTest = (
         transition={'.2s ease'}
       >
         <Flex py={4} px={5} whiteSpace={'nowrap'}>
-          <Box fontSize={'xl'} fontWeight={'bold'} flex={1}>
+          <Box fontSize={'lg'} fontWeight={'bold'} flex={1}>
             {t('core.chat.Debug test')}
           </Box>
           <MyTooltip label={t('core.chat.Restart')}>
diff --git a/projects/app/src/components/core/workflow/Flow/NodeTemplatesModal.tsx b/projects/app/src/components/core/workflow/Flow/NodeTemplatesModal.tsx
index 92bf94246..8739f85d0 100644
--- a/projects/app/src/components/core/workflow/Flow/NodeTemplatesModal.tsx
+++ b/projects/app/src/components/core/workflow/Flow/NodeTemplatesModal.tsx
@@ -47,7 +47,7 @@ enum TemplateTypeEnum {
   'teamPlugin' = 'teamPlugin'
 }
 
-const sliderWidth = 380;
+const sliderWidth = 390;
 
 const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => {
   const { t } = useTranslation();
@@ -138,6 +138,7 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => {
         bottom={0}
         w={`${sliderWidth}px`}
         onClick={onClose}
+        fontSize={'sm'}
       />
       <Flex
         zIndex={3}
@@ -184,8 +185,6 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => {
             <IconButton
               size={'sm'}
               icon={<MyIcon name={'common/backFill'} w={'14px'} color={'myGray.700'} />}
-              w={'26px'}
-              h={'26px'}
               borderColor={'myGray.300'}
               variant={'grayBase'}
               aria-label={''}
@@ -212,6 +211,7 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => {
                 _hover={{
                   color: 'primary.600'
                 }}
+                fontSize={'sm'}
                 onClick={() => router.push('/plugin/list')}
               >
                 <Box>去创建</Box>
@@ -341,7 +341,7 @@ const RenderList = React.memo(function RenderList({
             >
               {item.label && (
                 <Flex>
-                  <Box fontWeight={'bold'} flex={1}>
+                  <Box fontSize={'sm'} fontWeight={'bold'} flex={1}>
                     {t(item.label)}
                   </Box>
                 </Flex>
@@ -405,11 +405,11 @@ const RenderList = React.memo(function RenderList({
                     >
                       <Avatar
                         src={template.avatar}
-                        w={'30px'}
+                        w={'1.7rem'}
                         objectFit={'contain'}
                         borderRadius={'0'}
                       />
-                      <Box color={'black'} ml={5} flex={'1 0 0'}>
+                      <Box color={'black'} fontSize={'sm'} ml={5} flex={'1 0 0'}>
                         {t(template.name)}
                       </Box>
                     </Flex>
@@ -421,7 +421,7 @@ const RenderList = React.memo(function RenderList({
         </Box>
       </Box>
     );
-  }, [formatTemplates, isPc, onAddNode, onClose, setCurrentParent, t, templates.length]);
+  }, [appT, formatTemplates, isPc, onAddNode, onClose, setCurrentParent, t, templates.length]);
 
   return Render;
 });
diff --git a/projects/app/src/components/core/workflow/Flow/SelectAppModal.tsx b/projects/app/src/components/core/workflow/Flow/SelectAppModal.tsx
index 3ddc10455..66dc058a0 100644
--- a/projects/app/src/components/core/workflow/Flow/SelectAppModal.tsx
+++ b/projects/app/src/components/core/workflow/Flow/SelectAppModal.tsx
@@ -74,7 +74,7 @@ const SelectAppModal = ({
                 })}
           >
             <Avatar src={app.avatar} w={['16px', '22px']} />
-            <Box fontWeight={'bold'} ml={1}>
+            <Box fontSize={'sm'} color={'myGray.900'} ml={1}>
               {app.name}
             </Box>
           </Flex>
diff --git a/projects/app/src/components/core/workflow/Flow/components/ButtonEdge.tsx b/projects/app/src/components/core/workflow/Flow/components/ButtonEdge.tsx
index e45899527..3fa2c34b3 100644
--- a/projects/app/src/components/core/workflow/Flow/components/ButtonEdge.tsx
+++ b/projects/app/src/components/core/workflow/Flow/components/ButtonEdge.tsx
@@ -21,9 +21,10 @@ const ButtonEdge = (props: EdgeProps) => {
     sourcePosition,
     targetPosition,
     selected,
-    sourceHandleId,
     source,
+    sourceHandleId,
     target,
+    targetHandleId,
     style
   } = props;
 
@@ -86,12 +87,13 @@ const ButtonEdge = (props: EdgeProps) => {
 
   const edgeColor = useMemo(() => {
     const targetEdge = workflowDebugData?.runtimeEdges.find(
-      (edge) => edge.source === source && edge.target === target
+      (edge) => edge.sourceHandle === sourceHandleId && edge.targetHandle === targetHandleId
     );
     if (!targetEdge) {
       if (highlightEdge) return '#3370ff';
       return '#94B5FF';
     }
+    console.log(targetEdge);
     // debug mode
     const colorMap = {
       [RuntimeEdgeStatusEnum.active]: '#39CC83',
@@ -99,7 +101,7 @@ const ButtonEdge = (props: EdgeProps) => {
       [RuntimeEdgeStatusEnum.skipped]: '#8A95A7'
     };
     return colorMap[targetEdge.status];
-  }, [highlightEdge, source, target, workflowDebugData?.runtimeEdges]);
+  }, [highlightEdge, sourceHandleId, targetHandleId, workflowDebugData?.runtimeEdges]);
 
   const memoEdgeLabel = useMemo(() => {
     const arrowTransform = (() => {
diff --git a/projects/app/src/components/core/workflow/Flow/hooks/useDebug.tsx b/projects/app/src/components/core/workflow/Flow/hooks/useDebug.tsx
index 86297caba..1c45ee0b3 100644
--- a/projects/app/src/components/core/workflow/Flow/hooks/useDebug.tsx
+++ b/projects/app/src/components/core/workflow/Flow/hooks/useDebug.tsx
@@ -219,7 +219,7 @@ export const useDebug = () => {
               if (input.valueType === WorkflowIOValueTypeEnum.boolean) {
                 return (
                   <Box>
-                    <Switch size={'lg'} {...register(input.key)} />
+                    <Switch {...register(input.key)} />
                   </Box>
                 );
               }
diff --git a/projects/app/src/components/core/workflow/Flow/index.tsx b/projects/app/src/components/core/workflow/Flow/index.tsx
index 755fb9a80..2abbe4bba 100644
--- a/projects/app/src/components/core/workflow/Flow/index.tsx
+++ b/projects/app/src/components/core/workflow/Flow/index.tsx
@@ -28,7 +28,7 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useTranslation } from 'next-i18next';
 import { FlowNodeItemType } from '@fastgpt/global/core/workflow/type/index.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { connectionLineStyle, defaultEdgeOptions } from '../constants';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
 import { useKeyboard } from './hooks/useKeyboard';
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeCQNode.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeCQNode.tsx
index bb0d238bd..7d47f73b4 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeCQNode.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeCQNode.tsx
@@ -9,7 +9,7 @@ import type { ClassifyQuestionAgentItemType } from '@fastgpt/global/core/workflo
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { NodeInputKeyEnum } from '@fastgpt/global/core/workflow/constants';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { FlowNodeInputItemType } from '@fastgpt/global/core/workflow/type/io.d';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
 import { SourceHandle } from './render/Handle';
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/ExtractFieldModal.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/ExtractFieldModal.tsx
index d2ef331d9..a879c2a48 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/ExtractFieldModal.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/ExtractFieldModal.tsx
@@ -13,10 +13,11 @@ import type { ContextExtractAgentItemType } from '@fastgpt/global/core/workflow/
 import { useForm } from 'react-hook-form';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import { fnValueTypeSelect } from '@/web/core/workflow/constants/dataType';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 export const defaultField: ContextExtractAgentItemType = {
   valueType: 'string',
@@ -53,17 +54,15 @@ const ExtractFieldModal = ({
     >
       <ModalBody>
         <Flex mt={2} alignItems={'center'}>
-          <Flex alignItems={'center'} flex={['0 0 80px', '0 0 100px']}>
-            {t('core.module.extract.Required')}
-            <MyTooltip label={t('core.module.extract.Required Description')} forceShow>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+          <Flex alignItems={'center'} flex={['1 0 80px', '1 0 100px']}>
+            <FormLabel>{t('core.module.extract.Required')}</FormLabel>
+            <QuestionTip ml={1} label={t('core.module.extract.Required Description')}></QuestionTip>
           </Flex>
           <Switch {...register('required')} />
         </Flex>
         {required && (
           <Flex mt={5} alignItems={'center'}>
-            <Box flex={['0 0 80px', '0 0 100px']}>{t('core.module.Default value')}</Box>
+            <FormLabel flex={['0 0 80px', '0 0 100px']}>{t('core.module.Default value')}</FormLabel>
             <Input
               bg={'myGray.50'}
               placeholder={t('core.module.Default value placeholder')}
@@ -73,7 +72,7 @@ const ExtractFieldModal = ({
         )}
 
         <Flex alignItems={'center'} mt={5}>
-          <Box flex={['0 0 80px', '0 0 100px']}>{t('core.module.Data Type')}</Box>
+          <FormLabel flex={['0 0 80px', '0 0 100px']}>{t('core.module.Data Type')}</FormLabel>
           <Box flex={'1 0 0'}>
             <MySelect
               list={fnValueTypeSelect}
@@ -86,7 +85,7 @@ const ExtractFieldModal = ({
         </Flex>
 
         <Flex mt={5} alignItems={'center'}>
-          <Box flex={['0 0 80px', '0 0 100px']}>{t('Field name')}</Box>
+          <FormLabel flex={['0 0 80px', '0 0 100px']}>{t('Field name')}</FormLabel>
           <Input
             bg={'myGray.50'}
             placeholder="name/age/sql"
@@ -94,7 +93,9 @@ const ExtractFieldModal = ({
           />
         </Flex>
         <Flex mt={5} alignItems={'center'}>
-          <Box flex={['0 0 80px', '0 0 100px']}>{t('core.module.Field Description')}</Box>
+          <FormLabel flex={['0 0 80px', '0 0 100px']}>
+            {t('core.module.Field Description')}
+          </FormLabel>
           <Input
             bg={'myGray.50'}
             placeholder={t('core.module.extract.Field Description Placeholder')}
@@ -104,10 +105,10 @@ const ExtractFieldModal = ({
         {(valueType === 'string' || valueType === 'number') && (
           <Box mt={5}>
             <Flex alignItems={'center'}>
-              {t('core.module.extract.Enum Value')}({t('common.choosable')})
-              <MyTooltip label={t('core.module.extract.Enum Description')} forceShow>
-                <QuestionOutlineIcon ml={1} />
-              </MyTooltip>
+              <FormLabel>
+                {t('core.module.extract.Enum Value')}({t('common.choosable')})
+              </FormLabel>
+              <QuestionTip ml={1} label={t('core.module.extract.Enum Description')}></QuestionTip>
             </Flex>
 
             <Textarea
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/index.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/index.tsx
index 495f3d401..374d5f0f9 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/index.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeExtract/index.tsx
@@ -78,10 +78,12 @@ const NodeExtract = ({ data }: NodeProps<FlowNodeItemType>) => {
               <Table bg={'white'}>
                 <Thead>
                   <Tr>
-                    <Th bg={'myGray.50'}>字段名</Th>
+                    <Th bg={'myGray.50'} borderRadius={'none !important'}>
+                      字段名
+                    </Th>
                     <Th bg={'myGray.50'}>字段描述</Th>
                     <Th bg={'myGray.50'}>必须</Th>
-                    <Th bg={'myGray.50'}></Th>
+                    <Th bg={'myGray.50'} borderRadius={'none !important'}></Th>
                   </Tr>
                 </Thead>
                 <Tbody>
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeHttp/index.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeHttp/index.tsx
index 33c497184..0c730b868 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeHttp/index.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeHttp/index.tsx
@@ -26,7 +26,6 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import { FlowNodeInputItemType } from '@fastgpt/global/core/workflow/type/io.d';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import JSONEditor from '@fastgpt/web/components/common/Textarea/JsonEditor';
 import { formatEditorVariablePickerIcon } from '@fastgpt/global/core/workflow/utils';
 import { EditorVariablePickerType } from '@fastgpt/web/components/common/Textarea/PromptEditor/type';
@@ -40,6 +39,7 @@ import { WorkflowContext } from '../../../context';
 import { getWorkflowGlobalVariables } from '@/web/core/workflow/utils';
 import { useMemoizedFn } from 'ahooks';
 import { AppContext } from '@/web/core/app/context/appContext';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 const CurlImportModal = dynamic(() => import('./CurlImportModal'));
 
 export const HttpHeaders = [
@@ -305,9 +305,10 @@ export function RenderHttpProps({
       <Box>
         <Flex alignItems={'center'} mb={2} fontWeight={'medium'} color={'myGray.600'}>
           {t('core.module.Http request props')}
-          <MyTooltip label={t('core.module.http.Props tip', { variable: variableText })}>
-            <QuestionOutlineIcon ml={1} />
-          </MyTooltip>
+          <QuestionTip
+            ml={1}
+            label={t('core.module.http.Props tip', { variable: variableText })}
+          ></QuestionTip>
         </Flex>
         <Tabs
           list={[
@@ -468,89 +469,97 @@ const RenderForm = ({
 
   const Render = useMemo(() => {
     return (
-      <TableContainer overflowY={'visible'} overflowX={'unset'}>
-        <Table>
-          <Thead>
-            <Tr>
-              <Th px={2}>{t('core.module.http.Props name')}</Th>
-              <Th px={2}>{t('core.module.http.Props value')}</Th>
-            </Tr>
-          </Thead>
-          <Tbody>
-            {list.map((item, index) => (
-              <Tr key={`${input.key}${index}`}>
+      <Box mt={2} borderRadius={'md'} overflow={'hidden'} borderWidth={'1px'} borderBottom={'none'}>
+        <TableContainer overflowY={'visible'} overflowX={'unset'}>
+          <Table>
+            <Thead>
+              <Tr>
+                <Th px={2} borderBottomLeftRadius={'none !important'}>
+                  {t('core.module.http.Props name')}
+                </Th>
+                <Th px={2} borderBottomRadius={'none !important'}>
+                  {t('core.module.http.Props value')}
+                </Th>
+              </Tr>
+            </Thead>
+            <Tbody>
+              {list.map((item, index) => (
+                <Tr key={`${input.key}${index}`}>
+                  <Td p={0} w={'150px'}>
+                    <HttpInput
+                      hasVariablePlugin={false}
+                      hasDropDownPlugin={tabType === TabEnum.headers}
+                      setDropdownValue={(value) => {
+                        handleKeyChange(index, value);
+                        setUpdateTrigger((prev) => !prev);
+                      }}
+                      placeholder={t('core.module.http.Props name')}
+                      value={item.key}
+                      variables={leftVariables}
+                      onBlur={(val) => {
+                        handleKeyChange(index, val);
+                      }}
+                      updateTrigger={updateTrigger}
+                    />
+                  </Td>
+                  <Td p={0}>
+                    <Box display={'flex'} alignItems={'center'}>
+                      <HttpInput
+                        placeholder={t('core.module.http.Props value')}
+                        value={item.value}
+                        variables={variables}
+                        onBlur={(val) => {
+                          setList((prevList) =>
+                            prevList.map((item, i) =>
+                              i === index ? { ...item, value: val } : item
+                            )
+                          );
+                          setShouldUpdateNode(true);
+                        }}
+                      />
+                      <MyIcon
+                        name={'delete'}
+                        cursor={'pointer'}
+                        _hover={{ color: 'red.600' }}
+                        w={'14px'}
+                        onClick={() => {
+                          setList((prevlist) => prevlist.filter((val) => val.key !== item.key));
+                          setShouldUpdateNode(true);
+                        }}
+                      />
+                    </Box>
+                  </Td>
+                </Tr>
+              ))}
+              <Tr>
                 <Td p={0} w={'150px'}>
                   <HttpInput
                     hasVariablePlugin={false}
                     hasDropDownPlugin={tabType === TabEnum.headers}
-                    setDropdownValue={(value) => {
-                      handleKeyChange(index, value);
+                    setDropdownValue={(val) => {
+                      handleAddNewProps(val);
                       setUpdateTrigger((prev) => !prev);
                     }}
-                    placeholder={t('core.module.http.Props name')}
-                    value={item.key}
+                    placeholder={t('core.module.http.Add props')}
+                    value={''}
                     variables={leftVariables}
-                    onBlur={(val) => {
-                      handleKeyChange(index, val);
-                    }}
                     updateTrigger={updateTrigger}
+                    onBlur={(val) => {
+                      handleAddNewProps(val);
+                      setUpdateTrigger((prev) => !prev);
+                    }}
                   />
                 </Td>
                 <Td p={0}>
                   <Box display={'flex'} alignItems={'center'}>
-                    <HttpInput
-                      placeholder={t('core.module.http.Props value')}
-                      value={item.value}
-                      variables={variables}
-                      onBlur={(val) => {
-                        setList((prevList) =>
-                          prevList.map((item, i) => (i === index ? { ...item, value: val } : item))
-                        );
-                        setShouldUpdateNode(true);
-                      }}
-                    />
-                    <MyIcon
-                      name={'delete'}
-                      cursor={'pointer'}
-                      _hover={{ color: 'red.600' }}
-                      w={'14px'}
-                      onClick={() => {
-                        setList((prevlist) => prevlist.filter((val) => val.key !== item.key));
-                        setShouldUpdateNode(true);
-                      }}
-                    />
+                    <HttpInput />
                   </Box>
                 </Td>
               </Tr>
-            ))}
-            <Tr>
-              <Td p={0} w={'150px'}>
-                <HttpInput
-                  hasVariablePlugin={false}
-                  hasDropDownPlugin={tabType === TabEnum.headers}
-                  setDropdownValue={(val) => {
-                    handleAddNewProps(val);
-                    setUpdateTrigger((prev) => !prev);
-                  }}
-                  placeholder={t('core.module.http.Add props')}
-                  value={''}
-                  variables={leftVariables}
-                  updateTrigger={updateTrigger}
-                  onBlur={(val) => {
-                    handleAddNewProps(val);
-                    setUpdateTrigger((prev) => !prev);
-                  }}
-                />
-              </Td>
-              <Td p={0}>
-                <Box display={'flex'} alignItems={'center'}>
-                  <HttpInput />
-                </Box>
-              </Td>
-            </Tr>
-          </Tbody>
-        </Table>
-      </TableContainer>
+            </Tbody>
+          </Table>
+        </TableContainer>
+      </Box>
     );
   }, [
     handleAddNewProps,
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/ListItem.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/ListItem.tsx
index ad602f86f..9c63f918f 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/ListItem.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/ListItem.tsx
@@ -65,11 +65,8 @@ const ListItem = ({
       >
         <Container w={snapshot.isDragging ? '' : 'full'} className="nodrag">
           <Flex mb={4} alignItems={'center'}>
-            <DragIcon
-              visibility={ifElseList.length > 1 ? 'visible' : 'hidden'}
-              provided={provided}
-            />
-            <Box color={'black'} fontSize={'lg'} ml={2}>
+            {ifElseList.length > 1 && <DragIcon provided={provided} />}
+            <Box color={'black'} fontSize={'md'} ml={2}>
               {getElseIFLabel(conditionIndex)}
             </Box>
             {conditionItem.list?.length > 1 && (
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/index.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/index.tsx
index f393a0c36..4994217eb 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/index.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeIfElse/index.tsx
@@ -91,7 +91,7 @@ const NodeIfElse = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
 
         <Container position={'relative'}>
           <Flex alignItems={'center'}>
-            <Box color={'black'} fontSize={'lg'} ml={2}>
+            <Box color={'black'} fontSize={'md'} ml={2}>
               {IfElseResultEnum.ELSE}
             </Box>
             <SourceHandle
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeSystemConfig.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeSystemConfig.tsx
index d9220e2f3..43a09408d 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeSystemConfig.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeSystemConfig.tsx
@@ -129,7 +129,6 @@ function QuestionGuide({ chatConfig: { questionGuide = false }, setAppDetail }:
   return (
     <QGSwitch
       isChecked={questionGuide}
-      size={'md'}
       onChange={(e) => {
         const value = e.target.checked;
         setAppDetail((state) => ({
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/NodeVariableUpdate.tsx b/projects/app/src/components/core/workflow/Flow/nodes/NodeVariableUpdate.tsx
index 4225fb2ab..c012e2f07 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/NodeVariableUpdate.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/NodeVariableUpdate.tsx
@@ -224,7 +224,6 @@ const NodeVariableUpdate = ({ data, selected }: NodeProps<FlowNodeItemType>) =>
                   if (valueType === WorkflowIOValueTypeEnum.boolean) {
                     return (
                       <Switch
-                        size="lg"
                         defaultChecked={updateItem.value?.[1] === 'true'}
                         onChange={(e) => handleUpdate(String(e.target.checked))}
                       />
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/FieldEditModal.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/FieldEditModal.tsx
index 00ffc94d3..32d91017f 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/FieldEditModal.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/FieldEditModal.tsx
@@ -26,6 +26,7 @@ import { NodeInputKeyEnum, WorkflowIOValueTypeEnum } from '@fastgpt/global/core/
 import dynamic from 'next/dynamic';
 import MyNumberInput from '@fastgpt/web/components/common/Input/NumberInput/index';
 import { useI18n } from '@/web/context/I18n';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const JsonEditor = dynamic(() => import('@fastgpt/web/components/common/Textarea/JsonEditor'));
 const EmptyTip = dynamic(() => import('@fastgpt/web/components/common/EmptyTip'));
@@ -304,7 +305,7 @@ const FieldEditModal = ({
           <Stack flex={1} gap={5}>
             {showInputTypeSelect && (
               <Flex alignItems={'center'}>
-                <Box flex={'0 0 70px'}>{t('core.module.Input Type')}</Box>
+                <FormLabel flex={'0 0 70px'}>{t('core.module.Input Type')}</FormLabel>
                 <Box flex={1}>
                   <MySelect
                     list={inputTypeList}
@@ -320,7 +321,7 @@ const FieldEditModal = ({
             )}
             {showValueTypeSelect && !showInputTypeSelect && (
               <Flex alignItems={'center'}>
-                <Box flex={'0 0 70px'}>{t('core.module.Data Type')}</Box>
+                <FormLabel flex={'0 0 70px'}>{t('core.module.Data Type')}</FormLabel>
                 <Box flex={1}>
                   <MySelect
                     w={'full'}
@@ -336,7 +337,7 @@ const FieldEditModal = ({
             )}
             {showKeyInput && (
               <Flex alignItems={'center'}>
-                <Box flex={'0 0 70px'}>{t('core.module.Field Name')}</Box>
+                <FormLabel flex={'0 0 70px'}>{t('core.module.Field Name')}</FormLabel>
                 <Input
                   bg={'myGray.50'}
                   placeholder="appointment/sql"
@@ -348,9 +349,9 @@ const FieldEditModal = ({
             )}
             {showDescriptionInput && (
               <Box alignItems={'flex-start'}>
-                <Box flex={'0 0 70px'} mb={'1px'}>
+                <FormLabel flex={'0 0 70px'} mb={'1px'}>
                   {t('core.module.Field Description')}
-                </Box>
+                </FormLabel>
                 <Textarea
                   bg={'myGray.50'}
                   placeholder={
@@ -366,18 +367,18 @@ const FieldEditModal = ({
           {showInputTypeSelect && (
             <Stack flex={1} gap={5}>
               <Flex alignItems={'center'}>
-                <Box flex={'0 0 70px'}>{workflowT('Field required')}</Box>
+                <FormLabel flex={'0 0 70px'}>{workflowT('Field required')}</FormLabel>
                 <Switch {...register('required')} />
               </Flex>
               {showToolInput && (
                 <Flex alignItems={'center'}>
-                  <Box flex={'0 0 70px'}>工具参数</Box>
+                  <FormLabel flex={'0 0 70px'}>工具参数</FormLabel>
                   <Switch {...register('isToolInput')} />
                 </Flex>
               )}
               {showValueTypeSelect && (
                 <Flex alignItems={'center'}>
-                  <Box flex={'0 0 70px'}>{t('core.module.Data Type')}</Box>
+                  <FormLabel flex={'0 0 70px'}>{t('core.module.Data Type')}</FormLabel>
                   <Box flex={1}>
                     <MySelect
                       w={'full'}
@@ -393,7 +394,7 @@ const FieldEditModal = ({
               )}
               {showDefaultValue && (
                 <Flex alignItems={'center'}>
-                  <Box flex={'0 0 70px'}>{t('core.module.Default Value')}</Box>
+                  <FormLabel flex={'0 0 70px'}>{t('core.module.Default Value')}</FormLabel>
                   {inputType === FlowNodeInputTypeEnum.numberInput && (
                     <Input
                       bg={'myGray.50'}
@@ -430,7 +431,7 @@ const FieldEditModal = ({
               )}
               {showMaxLenInput && (
                 <Flex alignItems={'center'}>
-                  <Box flex={'0 0 70px'}>{t('core.module.Max Length')}</Box>
+                  <FormLabel flex={'0 0 70px'}>{t('core.module.Max Length')}</FormLabel>
                   <MyNumberInput
                     flex={'1 0 0'}
                     bg={'myGray.50'}
@@ -447,7 +448,7 @@ const FieldEditModal = ({
               {showMinMaxInput && (
                 <>
                   <Flex alignItems={'center'}>
-                    <Box flex={'0 0 70px'}>{t('core.module.Max Value')}</Box>
+                    <FormLabel flex={'0 0 70px'}>{t('core.module.Max Value')}</FormLabel>
                     <MyNumberInput
                       flex={'1 0 0'}
                       bg={'myGray.50'}
@@ -459,7 +460,7 @@ const FieldEditModal = ({
                     />
                   </Flex>
                   <Flex alignItems={'center'}>
-                    <Box flex={'0 0 70px'}>{t('core.module.Min Value')}</Box>
+                    <FormLabel flex={'0 0 70px'}>{t('core.module.Min Value')}</FormLabel>
                     <MyNumberInput
                       flex={'1 0 0'}
                       bg={'myGray.50'}
@@ -475,13 +476,13 @@ const FieldEditModal = ({
               {showDynamicInput && (
                 <Stack gap={5}>
                   <Flex alignItems={'center'}>
-                    <Box flex={'0 0 70px'}>{t('core.module.Input Type')}</Box>
+                    <FormLabel flex={'0 0 70px'}>{t('core.module.Input Type')}</FormLabel>
                     <Box flex={1} fontWeight={'bold'}>
                       {t('core.workflow.inputType.Reference')}
                     </Box>
                   </Flex>
                   <Flex alignItems={'center'}>
-                    <Box flex={'0 0 70px'}>{t('core.module.Data Type')}</Box>
+                    <FormLabel flex={'0 0 70px'}>{t('core.module.Data Type')}</FormLabel>
                     <Box flex={1}>
                       <MySelect
                         list={dataTypeSelectList}
@@ -496,7 +497,7 @@ const FieldEditModal = ({
                     </Box>
                   </Flex>
                   <Flex alignItems={'center'}>
-                    <Box flex={'0 0 70px'}>{t('core.workflow.inputType.Required')}</Box>
+                    <FormLabel flex={'0 0 70px'}>{t('core.workflow.inputType.Required')}</FormLabel>
                     <Box flex={1}>
                       <Switch {...register('dynamicParamDefaultValue.required')} />
                     </Box>
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/Handle/ToolHandle.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/Handle/ToolHandle.tsx
index 27763e28e..648ea2407 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/Handle/ToolHandle.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/Handle/ToolHandle.tsx
@@ -1,4 +1,4 @@
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { Box, BoxProps } from '@chakra-ui/react';
 import { NodeOutputKeyEnum } from '@fastgpt/global/core/workflow/constants';
 import { useTranslation } from 'next-i18next';
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/NodeCard.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/NodeCard.tsx
index b77a370f8..5e7763d4c 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/NodeCard.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/NodeCard.tsx
@@ -23,7 +23,7 @@ import { WorkflowContext } from '../../../context';
 import { useI18n } from '@/web/context/I18n';
 import { moduleTemplatesFlat } from '@fastgpt/global/core/workflow/template/constants';
 import { QuestionOutlineIcon } from '@chakra-ui/icons';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 
 type Props = FlowNodeItemType & {
@@ -140,7 +140,7 @@ const NodeCard = (props: Props) => {
           {/* avatar and name */}
           <Flex alignItems={'center'}>
             <Avatar src={avatar} borderRadius={'0'} objectFit={'contain'} w={'30px'} h={'30px'} />
-            <Box ml={3} fontSize={'lg'} fontWeight={'medium'}>
+            <Box ml={3} fontSize={'md'} fontWeight={'medium'}>
               {t(name)}
             </Box>
             {!menuForbid?.rename && (
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/Label.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/Label.tsx
index 31aae1fea..6d7d4d302 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/Label.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/Label.tsx
@@ -2,8 +2,7 @@ import { FlowNodeInputItemType } from '@fastgpt/global/core/workflow/type/io.d';
 import React, { useCallback, useMemo, useState } from 'react';
 import { useTranslation } from 'next-i18next';
 import { Box, Flex } from '@chakra-ui/react';
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 
 import NodeInputSelect from '@fastgpt/web/components/core/workflow/NodeInputSelect';
 import MyIcon from '@fastgpt/web/components/common/Icon';
@@ -14,6 +13,7 @@ import { FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/consta
 import ValueTypeLabel from '../ValueTypeLabel';
 import { useContextSelector } from 'use-context-selector';
 import { WorkflowContext } from '@/components/core/workflow/context';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 const FieldEditModal = dynamic(() => import('../FieldEditModal'));
 
 type Props = {
@@ -62,19 +62,20 @@ const InputLabel = ({ nodeId, input }: Props) => {
 
     return (
       <Flex className="nodrag" cursor={'default'} alignItems={'center'} position={'relative'}>
-        <Box position={'relative'} fontWeight={'medium'} color={'myGray.600'}>
+        <Flex
+          alignItems={'center'}
+          position={'relative'}
+          fontWeight={'medium'}
+          color={'myGray.600'}
+        >
           {required && (
             <Box position={'absolute'} left={-2} top={-1} color={'red.600'}>
               *
             </Box>
           )}
           {t(label)}
-          {description && (
-            <MyTooltip label={t(description)} forceShow>
-              <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-            </MyTooltip>
-          )}
-        </Box>
+          {description && <QuestionTip ml={1} label={t(description)}></QuestionTip>}
+        </Flex>
         {/* value type */}
         {renderType === FlowNodeInputTypeEnum.reference && <ValueTypeLabel valueType={valueType} />}
         {/* edit config */}
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SelectDataset.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SelectDataset.tsx
index be8f034f0..96275b2de 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SelectDataset.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SelectDataset.tsx
@@ -85,7 +85,7 @@ const SelectDatasetRender = ({ inputs = [], item, nodeId }: RenderInputProps) =>
                 w={0}
                 className="textEllipsis"
                 fontWeight={'bold'}
-                fontSize={['md', 'lg', 'xl']}
+                fontSize={['md', 'lg']}
               >
                 {item.name}
               </Box>
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SettingQuotePrompt.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SettingQuotePrompt.tsx
index 438593757..c96a27a5a 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SettingQuotePrompt.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/RenderInput/templates/SettingQuotePrompt.tsx
@@ -6,12 +6,11 @@ import { useForm } from 'react-hook-form';
 import { PromptTemplateItem } from '@fastgpt/global/core/ai/type';
 import { useTranslation } from 'next-i18next';
 import { ModalBody } from '@chakra-ui/react';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import {
   Prompt_QuotePromptList,
   Prompt_QuoteTemplateList
 } from '@fastgpt/global/core/ai/prompt/AIChat';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
 import PromptTemplate from '@/components/PromptTemplate';
 import { NodeInputKeyEnum, WorkflowIOValueTypeEnum } from '@fastgpt/global/core/workflow/constants';
@@ -23,6 +22,8 @@ import { WorkflowContext } from '@/components/core/workflow/context';
 import { getWorkflowGlobalVariables } from '@/web/core/workflow/utils';
 import { useCreation } from 'ahooks';
 import { AppContext } from '@/web/core/app/context/appContext';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const LabelStyles: BoxProps = {
   fontSize: ['sm', 'md']
@@ -178,18 +179,17 @@ const SettingQuotePrompt = (props: RenderInputProps) => {
           <ModalBody>
             <Box>
               <Flex {...LabelStyles} mb={1}>
-                {t('core.app.Quote templates')}
-                <MyTooltip
+                <FormLabel>{t('core.app.Quote templates')}</FormLabel>
+                <QuestionTip
+                  ml={1}
                   label={t('template.Quote Content Tip', {
                     default: Prompt_QuoteTemplateList[0].value
                   })}
-                  forceShow
-                >
-                  <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-                </MyTooltip>
+                ></QuestionTip>
                 <Box flex={1} />
                 <Box
                   {...selectTemplateBtn}
+                  fontSize={'sm'}
                   onClick={() =>
                     setSelectTemplateData({
                       title: t('core.app.Select quote template'),
@@ -216,15 +216,13 @@ const SettingQuotePrompt = (props: RenderInputProps) => {
             </Box>
             <Box mt={4}>
               <Flex {...LabelStyles} mb={1}>
-                {t('core.app.Quote prompt')}
-                <MyTooltip
+                <FormLabel>{t('core.app.Quote prompt')}</FormLabel>
+                <QuestionTip
+                  ml={1}
                   label={t('template.Quote Prompt Tip', {
                     default: Prompt_QuotePromptList[0].value
                   })}
-                  forceShow
-                >
-                  <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-                </MyTooltip>
+                ></QuestionTip>
               </Flex>
               <PromptEditor
                 variables={quotePromptVariables}
diff --git a/projects/app/src/components/core/workflow/Flow/nodes/render/VariableTable.tsx b/projects/app/src/components/core/workflow/Flow/nodes/render/VariableTable.tsx
index 06be51218..8fbc73faa 100644
--- a/projects/app/src/components/core/workflow/Flow/nodes/render/VariableTable.tsx
+++ b/projects/app/src/components/core/workflow/Flow/nodes/render/VariableTable.tsx
@@ -51,15 +51,17 @@ const VariableTable = ({
         borderRadius={'md'}
         overflow={'hidden'}
         borderWidth={'1px'}
-        borderBottom="none"
+        borderBottom={'none'}
       >
         <TableContainer>
           <Table bg={'white'}>
             <Thead>
               <Tr>
-                <Th>{t('core.module.variable.variable name')}</Th>
+                <Th borderBottomLeftRadius={'none !important'}>
+                  {t('core.module.variable.variable name')}
+                </Th>
                 <Th>{t('core.workflow.Value type')}</Th>
-                <Th></Th>
+                <Th borderBottomRightRadius={'none !important'}></Th>
               </Tr>
             </Thead>
             <Tbody>
diff --git a/projects/app/src/components/core/workflow/components/PublishHistoriesSlider.tsx b/projects/app/src/components/core/workflow/components/PublishHistoriesSlider.tsx
index ef764817d..8a5c36474 100644
--- a/projects/app/src/components/core/workflow/components/PublishHistoriesSlider.tsx
+++ b/projects/app/src/components/core/workflow/components/PublishHistoriesSlider.tsx
@@ -105,7 +105,7 @@ const PublishHistoriesSlider = () => {
         <Button
           mx={'20px'}
           variant={'whitePrimary'}
-          mb={1}
+          mb={2}
           isDisabled={!selectedHistoryId}
           onClick={() => {
             setSelectedHistoryId(undefined);
@@ -125,7 +125,7 @@ const PublishHistoriesSlider = () => {
               <Flex
                 key={data.index}
                 alignItems={'center'}
-                py={4}
+                py={3}
                 px={3}
                 borderRadius={'md'}
                 cursor={'pointer'}
diff --git a/projects/app/src/components/support/apikey/Table.tsx b/projects/app/src/components/support/apikey/Table.tsx
index 188929980..2888735a3 100644
--- a/projects/app/src/components/support/apikey/Table.tsx
+++ b/projects/app/src/components/support/apikey/Table.tsx
@@ -15,10 +15,6 @@ import {
   useTheme,
   Link,
   Input,
-  MenuList,
-  MenuItem,
-  MenuButton,
-  Menu,
   IconButton
 } from '@chakra-ui/react';
 import {
@@ -31,7 +27,7 @@ import type { EditApiKeyProps } from '@/global/support/openapi/api.d';
 import { useQuery, useMutation } from '@tanstack/react-query';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import dayjs from 'dayjs';
-import { AddIcon, QuestionOutlineIcon } from '@chakra-ui/icons';
+import { AddIcon } from '@chakra-ui/icons';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useTranslation } from 'next-i18next';
@@ -39,11 +35,12 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useForm } from 'react-hook-form';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
-import MyTooltip from '@/components/MyTooltip';
 import { getDocPath } from '@/web/common/system/doc';
 import MyMenu from '@fastgpt/web/components/common/MyMenu';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
 import { useI18n } from '@/web/context/I18n';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 type EditProps = EditApiKeyProps & { _id?: string };
 const defaultEditData: EditProps = {
@@ -91,7 +88,7 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
       <Box display={['block', 'flex']} py={[0, 3]} px={5} alignItems={'center'}>
         <Box flex={1}>
           <Flex alignItems={'flex-end'}>
-            <Box fontSize={['md', 'xl']} fontWeight={'bold'}>
+            <Box color={'myGray.900'} fontSize={'lg'}>
               {t('support.openapi.Api manager')}
             </Box>
             {feConfigs?.docUrl && (
@@ -100,18 +97,19 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
                 target={'_blank'}
                 ml={1}
                 color={'primary.500'}
+                fontSize={'sm'}
               >
                 {t('common.Read document')}
               </Link>
             )}
           </Flex>
-          <Box fontSize={'sm'} color={'myGray.600'}>
+          <Box fontSize={'xs'} color={'myGray.600'}>
             {tips}
           </Box>
         </Box>
         <Flex
           mt={[2, 0]}
-          bg={'myWhite.600'}
+          bg={'myGray.100'}
           py={2}
           px={4}
           borderRadius={'md'}
@@ -119,10 +117,10 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
           userSelect={'none'}
           onClick={() => copyData(baseUrl, t('support.openapi.Copy success'))}
         >
-          <Box border={theme.borders.md} px={2} borderRadius={'md'} fontSize={'sm'}>
+          <Box border={theme.borders.md} px={2} borderRadius={'md'} fontSize={'xs'}>
             {t('support.openapi.Api baseurl')}
           </Box>
-          <Box ml={2} color={'myGray.900'} fontSize={['sm', 'md']}>
+          <Box ml={2} fontSize={'sm'}>
             {baseUrl}
           </Box>
         </Flex>
@@ -200,21 +198,25 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
                     }
                     menuList={[
                       {
-                        label: t('common.Edit'),
-                        icon: 'edit',
-                        onClick: () =>
-                          setEditData({
-                            _id,
-                            name,
-                            limit,
-                            appId
-                          })
-                      },
-                      {
-                        label: t('common.Delete'),
-                        icon: 'delete',
-                        type: 'danger',
-                        onClick: () => openConfirm(() => onclickRemove(_id))()
+                        children: [
+                          {
+                            label: t('common.Edit'),
+                            icon: 'edit',
+                            onClick: () =>
+                              setEditData({
+                                _id,
+                                name,
+                                limit,
+                                appId
+                              })
+                          },
+                          {
+                            label: t('common.Delete'),
+                            icon: 'delete',
+                            type: 'danger',
+                            onClick: () => openConfirm(() => onclickRemove(_id))()
+                          }
+                        ]
                       }
                     ]}
                   />
@@ -248,10 +250,8 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
         iconSrc="/imgs/modal/key.svg"
         title={
           <Box>
-            <Box fontWeight={'bold'} fontSize={'xl'}>
-              {t('support.openapi.New api key')}
-            </Box>
-            <Box fontSize={'sm'} color={'myGray.600'}>
+            <Box fontWeight={'bold'}>{t('support.openapi.New api key')}</Box>
+            <Box fontSize={'xs'} color={'myGray.600'}>
               {t('support.openapi.New api key tip')}
             </Box>
           </Box>
@@ -332,7 +332,7 @@ function EditKeyModal({
     >
       <ModalBody>
         <Flex alignItems={'center'}>
-          <Box flex={'0 0 90px'}>{t('Name')}:</Box>
+          <FormLabel flex={'0 0 90px'}>{t('Name')}</FormLabel>
           <Input
             placeholder={publishT('key alias') || 'key alias'}
             maxLength={20}
@@ -344,12 +344,10 @@ function EditKeyModal({
         {feConfigs?.isPlus && (
           <>
             <Flex alignItems={'center'} mt={4}>
-              <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {t('support.outlink.Max usage points')}:
-                <MyTooltip label={t('support.outlink.Max usage points tip')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
-              </Flex>
+              <FormLabel display={'flex'} flex={'0 0 90px'} alignItems={'center'}>
+                {t('support.outlink.Max usage points')}
+                <QuestionTip ml={1} label={t('support.outlink.Max usage points tip')}></QuestionTip>
+              </FormLabel>
               <Input
                 {...register('limit.maxUsagePoints', {
                   min: -1,
@@ -360,9 +358,7 @@ function EditKeyModal({
               />
             </Flex>
             <Flex alignItems={'center'} mt={4}>
-              <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {t('common.Expired Time')}:
-              </Flex>
+              <FormLabel flex={'0 0 90px'}>{t('common.Expired Time')}</FormLabel>
               <Input
                 type="datetime-local"
                 defaultValue={
diff --git a/projects/app/src/components/support/permission/IconText/index.tsx b/projects/app/src/components/support/permission/IconText/index.tsx
index db232e7bd..6c15cbd6b 100644
--- a/projects/app/src/components/support/permission/IconText/index.tsx
+++ b/projects/app/src/components/support/permission/IconText/index.tsx
@@ -9,6 +9,8 @@ import { Permission } from '@fastgpt/global/support/permission/controller';
 const PermissionIconText = ({
   permission,
   defaultPermission,
+  w = '1rem',
+  fontSize = 'mini',
   ...props
 }: {
   permission?: `${PermissionTypeEnum}`;
@@ -25,9 +27,9 @@ const PermissionIconText = ({
   }, [defaultPermission, permission]);
 
   return PermissionTypeMap[per] ? (
-    <Flex alignItems={'center'} {...props}>
-      <MyIcon name={PermissionTypeMap[per]?.iconLight as any} w={'14px'} />
-      <Box ml={'2px'} lineHeight={1}>
+    <Flex alignItems={'center'} fontSize={fontSize} {...props}>
+      <MyIcon name={PermissionTypeMap[per]?.iconLight as any} w={w} />
+      <Box ml={'2px'} lineHeight={1} fontSize={'xs'}>
         {t(PermissionTypeMap[per]?.label)}
       </Box>
     </Flex>
diff --git a/projects/app/src/components/support/permission/MemberManager/AddMemberModal.tsx b/projects/app/src/components/support/permission/MemberManager/AddMemberModal.tsx
index 17e35e35b..c2fa9d98e 100644
--- a/projects/app/src/components/support/permission/MemberManager/AddMemberModal.tsx
+++ b/projects/app/src/components/support/permission/MemberManager/AddMemberModal.tsx
@@ -93,13 +93,12 @@ export function AddMemberModal({ onClose }: AddModalPropsType) {
             p="4"
             minH="200px"
           >
-            <InputGroup alignItems="center" h="32px" my="2" py="1">
+            <InputGroup alignItems="center" size="sm">
               <InputLeftElement>
                 <MyIcon name="common/searchLight" w="16px" color={'myGray.500'} />
               </InputLeftElement>
               <Input
                 placeholder="搜索用户名"
-                fontSize="lg"
                 bgColor="myGray.50"
                 onChange={(e) => setSearchText(e.target.value)}
               />
@@ -128,7 +127,6 @@ export function AddMemberModal({ onClose }: AddModalPropsType) {
                     }}
                   >
                     <Checkbox
-                      size="lg"
                       mr="3"
                       isChecked={selectedMemberIdList.includes(member.tmbId)}
                       onChange={onChange}
@@ -167,9 +165,7 @@ export function AddMemberModal({ onClose }: AddModalPropsType) {
                     _notLast={{ mb: 2 }}
                   >
                     <Avatar src={member.avatar} w="24px" />
-                    <Box w="full" fontSize="lg">
-                      {member.memberName}
-                    </Box>
+                    <Box w="full">{member.memberName}</Box>
                     <MyIcon
                       name="common/closeLight"
                       w="16px"
@@ -202,7 +198,7 @@ export function AddMemberModal({ onClose }: AddModalPropsType) {
               h={'32px'}
             >
               {perLabel}
-              <ChevronDownIcon fontSize={'lg'} />
+              <ChevronDownIcon fontSize={'md'} />
             </Flex>
           }
           onChange={(v) => setSelectedPermission(v)}
diff --git a/projects/app/src/components/support/permission/MemberManager/ManageModal.tsx b/projects/app/src/components/support/permission/MemberManager/ManageModal.tsx
index e65c5f4fb..817410653 100644
--- a/projects/app/src/components/support/permission/MemberManager/ManageModal.tsx
+++ b/projects/app/src/components/support/permission/MemberManager/ManageModal.tsx
@@ -64,10 +64,13 @@ function ManageModal({ onClose }: ManageModalProps) {
               <Tr>
                 <Th border="none">名称</Th>
                 <Th border="none">权限</Th>
-                <Th border="none">操作</Th>
+                <Th border="none" w={'40px'}>
+                  操作
+                </Th>
               </Tr>
             </Thead>
             <Tbody>
+              <Tr h={'10px'} />
               {collaboratorList?.map((item) => {
                 return (
                   <Tr
diff --git a/projects/app/src/components/support/permission/MemberManager/PermissionSelect.tsx b/projects/app/src/components/support/permission/MemberManager/PermissionSelect.tsx
index a1054f068..622ee2d9c 100644
--- a/projects/app/src/components/support/permission/MemberManager/PermissionSelect.tsx
+++ b/projects/app/src/components/support/permission/MemberManager/PermissionSelect.tsx
@@ -143,6 +143,7 @@ function PermissionSelect({
           }
           zIndex={99}
           overflowY={'auto'}
+          whiteSpace={'pre-wrap'}
         >
           {/* The list of single select permissions */}
           {permissionSelectList.singleCheckBoxList.map((item) => {
@@ -164,12 +165,14 @@ function PermissionSelect({
                   : {})}
                 {...MenuStyle}
                 onClick={change}
-                maxW={['70vw', '300px']}
+                maxW={['70vw', '260px']}
               >
-                <Radio size="lg" isChecked={selectedSingleValue === item.value} />
+                <Radio isChecked={selectedSingleValue === item.value} />
                 <Box ml={4}>
                   <Box>{item.name}</Box>
-                  <Box color={'myGray.500'}>{item.description}</Box>
+                  <Box color={'myGray.500'} fontSize={'mini'}>
+                    {item.description}
+                  </Box>
                 </Box>
               </Flex>
             );
diff --git a/projects/app/src/components/support/permission/MemberManager/index.tsx b/projects/app/src/components/support/permission/MemberManager/index.tsx
index c83e5e146..5b8404baf 100644
--- a/projects/app/src/components/support/permission/MemberManager/index.tsx
+++ b/projects/app/src/components/support/permission/MemberManager/index.tsx
@@ -34,7 +34,7 @@ function MemberManger() {
   return (
     <>
       <Flex alignItems="center" flexDirection="row" justifyContent="space-between" w="full">
-        <Box>协作者</Box>
+        <Box fontSize={'sm'}>协作者</Box>
         <Flex flexDirection="row" gap="2">
           <Button
             size="sm"
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/TeamCard.tsx b/projects/app/src/components/support/user/team/TeamManageModal/TeamCard.tsx
index d2c7d11a9..681062dea 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/TeamCard.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/TeamCard.tsx
@@ -97,9 +97,9 @@ function TeamCard() {
         py={4}
         borderBottom={'1.5px solid'}
         borderBottomColor={'myGray.100'}
-        mb={3}
+        mb={2}
       >
-        <Box fontSize={['lg', 'xl']} fontWeight={'bold'} alignItems={'center'}>
+        <Box fontSize={['sm', 'md']} fontWeight={'bold'} alignItems={'center'}>
           {userInfo?.team.teamName}
         </Box>
         {userInfo?.team.role === TeamMemberRoleEnum.owner && (
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/TeamList.tsx b/projects/app/src/components/support/user/team/TeamManageModal/TeamList.tsx
index 610258b7f..3a73c2e2e 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/TeamList.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/TeamList.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, Flex, IconButton } from '@chakra-ui/react';
+import { Box, Button, Flex, IconButton, Text } from '@chakra-ui/react';
 import Avatar from '@/components/Avatar';
 import { useTranslation } from 'next-i18next';
 import MyIcon from '@fastgpt/web/components/common/Icon';
@@ -28,7 +28,7 @@ function TeamList() {
         h={'40px'}
         borderBottom={'1.5px solid rgba(0, 0, 0, 0.05)'}
       >
-        <Box flex={['0 0 auto', 1]} fontWeight={'bold'} fontSize={['md', 'lg']}>
+        <Box flex={['0 0 auto', 1]} fontSize={['sm', 'md']}>
           {t('common.Team')}
         </Box>
         {/* if there is no team */}
@@ -73,6 +73,7 @@ function TeamList() {
             <Box
               flex={'1 0 0'}
               w={0}
+              fontSize={'sm'}
               {...(team.role === TeamMemberRoleEnum.owner
                 ? {
                     fontWeight: 'bold'
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/components/EditInfoModal.tsx b/projects/app/src/components/support/user/team/TeamManageModal/components/EditInfoModal.tsx
index e3e433867..63f84e7f7 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/components/EditInfoModal.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/components/EditInfoModal.tsx
@@ -8,7 +8,7 @@ import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { Box, Button, Flex, Input, ModalBody, ModalFooter } from '@chakra-ui/react';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import Avatar from '@/components/Avatar';
 import { postCreateTeam, putUpdateTeam } from '@/web/support/user/team/api';
 import { CreateTeamProps } from '@fastgpt/global/support/user/team/controller.d';
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/components/MemberTable.tsx b/projects/app/src/components/support/user/team/TeamManageModal/components/MemberTable.tsx
index a9f74d188..4528cdc5b 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/components/MemberTable.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/components/MemberTable.tsx
@@ -21,7 +21,9 @@ function MemberTable() {
   const { t } = useTranslation();
   const { members, refetchMembers } = useContextSelector(TeamModalContext, (v) => v);
 
-  const { ConfirmModal: ConfirmRemoveMemberModal, openConfirm: openRemoveMember } = useConfirm({});
+  const { ConfirmModal: ConfirmRemoveMemberModal, openConfirm: openRemoveMember } = useConfirm({
+    type: 'delete'
+  });
 
   const { mutate: onRemoveMember, isLoading: isRemovingMember } = useRequest({
     mutationFn: delRemoveMember,
@@ -34,14 +36,14 @@ function MemberTable() {
 
   return (
     <MyBox isLoading={isRemovingMember}>
-      <TableContainer overflow={'unset'}>
+      <TableContainer overflow={'unset'} fontSize={'sm'}>
         <Table overflow={'unset'}>
           <Thead bg={'myWhite.400'}>
             <Tr>
-              <Th>{t('common.Username')}</Th>
+              <Th borderRadius={'none !important'}>{t('common.Username')}</Th>
               <Th>{t('user.team.Role')}</Th>
               <Th>{t('common.Status')}</Th>
-              <Th>{t('common.Action')}</Th>
+              <Th borderRadius={'none !important'}>{t('common.Action')}</Th>
             </Tr>
           </Thead>
           <Tbody>
@@ -67,36 +69,35 @@ function MemberTable() {
                         Button={
                           <MenuButton
                             _hover={{
-                              bg: 'myWhite.600'
+                              color: 'primary.600'
                             }}
                             borderRadius={'md'}
                             px={2}
                             py={1}
                             lineHeight={1}
                           >
-                            <MyIcon
-                              name={'edit'}
-                              cursor={'pointer'}
-                              w="14px"
-                              _hover={{ color: 'primary.500' }}
-                            />
+                            <MyIcon name={'edit'} cursor={'pointer'} w="1rem" />
                           </MenuButton>
                         }
                         menuList={[
                           {
-                            label: t('user.team.Remove Member Tip'),
-                            onClick: () =>
-                              openRemoveMember(
-                                () =>
-                                  onRemoveMember({
-                                    teamId: item.teamId,
-                                    memberId: item.tmbId
-                                  }),
-                                undefined,
-                                t('user.team.Remove Member Confirm Tip', {
-                                  username: item.memberName
-                                })
-                              )()
+                            children: [
+                              {
+                                label: t('user.team.Remove Member Tip'),
+                                onClick: () =>
+                                  openRemoveMember(
+                                    () =>
+                                      onRemoveMember({
+                                        teamId: item.teamId,
+                                        memberId: item.tmbId
+                                      }),
+                                    undefined,
+                                    t('user.team.Remove Member Confirm Tip', {
+                                      username: item.memberName
+                                    })
+                                  )()
+                              }
+                            ]
                           }
                         ]}
                       />
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/AddManager.tsx b/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/AddManager.tsx
index acc5e5882..ca599e439 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/AddManager.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/AddManager.tsx
@@ -78,13 +78,13 @@ function AddManagerModal({ onClose, onSuccess }: { onClose: () => void; onSucces
           borderColor="myGray.200"
         >
           <Flex flexDirection="column" p="4">
-            <InputGroup alignItems="center" h="32px" my="2" py="1">
+            <InputGroup alignItems="center" size={'sm'}>
               <InputLeftElement>
                 <MyIcon name="common/searchLight" w="16px" color={'myGray.500'} />
               </InputLeftElement>
               <Input
                 placeholder="搜索用户名"
-                fontSize="lg"
+                fontSize="sm"
                 bg={'myGray.50'}
                 onChange={(e) => {
                   setSearchKey(e.target.value);
@@ -98,7 +98,6 @@ function AddManagerModal({ onClose, onSuccess }: { onClose: () => void; onSucces
                     py="2"
                     px={3}
                     borderRadius={'md'}
-                    fontSize="lg"
                     alignItems="center"
                     key={member.tmbId}
                     cursor={'pointer'}
@@ -112,8 +111,8 @@ function AddManagerModal({ onClose, onSuccess }: { onClose: () => void; onSucces
                       }
                     }}
                   >
-                    <Checkbox isChecked={selected.includes(member)} size="lg" />
-                    <Avatar src={member.avatar} w="24px" />
+                    <Checkbox isChecked={selected.includes(member)} />
+                    <Avatar ml={2} src={member.avatar} w="1.5rem" />
                     {member.memberName}
                   </Flex>
                 );
@@ -135,11 +134,13 @@ function AddManagerModal({ onClose, onSuccess }: { onClose: () => void; onSucces
                     _hover={{ bg: 'myGray.50' }}
                     _notLast={{ mb: 2 }}
                   >
-                    <Avatar src={member.avatar} w="24px" />
-                    <Box w="full" fontSize="lg">
-                      {member.memberName}
-                    </Box>
-                    <CloseButton
+                    <Avatar src={member.avatar} w="1.5rem" />
+                    <Box w="full">{member.memberName}</Box>
+                    <MyIcon
+                      name={'common/closeLight'}
+                      w={'1rem'}
+                      cursor={'pointer'}
+                      _hover={{ color: 'red.600' }}
                       onClick={() =>
                         setSelected([...selected.filter((item) => item.tmbId != member.tmbId)])
                       }
diff --git a/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/index.tsx b/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/index.tsx
index 9440ffd08..7f41fa25e 100644
--- a/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/index.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/components/PermissionManage/index.tsx
@@ -47,7 +47,7 @@ function PermissionManage() {
         justifyContent={'space-between'}
       >
         <Flex>
-          <Box fontSize={['md', 'lg']} fontWeight={'bold'} alignItems={'center'}>
+          <Box fontSize={['sm', 'md']} fontWeight={'bold'} alignItems={'center'}>
             {t('user.team.role.Admin')}
           </Box>
           <Box
diff --git a/projects/app/src/components/support/user/team/TeamMenu/index.tsx b/projects/app/src/components/support/user/team/TeamMenu/index.tsx
index 6c43b553e..f875db59f 100644
--- a/projects/app/src/components/support/user/team/TeamMenu/index.tsx
+++ b/projects/app/src/components/support/user/team/TeamMenu/index.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { Box, Button, Flex, Image, useDisclosure } from '@chakra-ui/react';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import dynamic from 'next/dynamic';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useToast } from '@fastgpt/web/hooks/useToast';
diff --git a/projects/app/src/components/support/wallet/StandardPlanContentList.tsx b/projects/app/src/components/support/wallet/StandardPlanContentList.tsx
index 1614dd9ac..8ff829157 100644
--- a/projects/app/src/components/support/wallet/StandardPlanContentList.tsx
+++ b/projects/app/src/components/support/wallet/StandardPlanContentList.tsx
@@ -6,9 +6,9 @@ import { Box, Flex, Grid } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
 import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import { useRouter } from 'next/router';
 import { AI_POINT_USAGE_CARD_ROUTE } from '@/web/support/wallet/sub/constants';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const StandardPlanContentList = ({
   level,
@@ -43,7 +43,7 @@ const StandardPlanContentList = ({
   }, [subPlans?.standard, level, mode]);
 
   return planContent ? (
-    <Grid gap={4}>
+    <Grid gap={4} fontSize={'sm'}>
       <Flex alignItems={'center'}>
         <MyIcon name={'price/right'} w={'16px'} mr={3} />
         <Box color={'myGray.600'}>
@@ -92,14 +92,13 @@ const StandardPlanContentList = ({
               amount: planContent.totalPoints
             })}
           </Box>
-          <MyTooltip label={t('support.wallet.subscription.AI points click to read tip')}>
-            <QuestionOutlineIcon
-              ml={'2px'}
-              onClick={() => {
-                router.push(AI_POINT_USAGE_CARD_ROUTE);
-              }}
-            />
-          </MyTooltip>
+          <QuestionTip
+            ml={1}
+            label={t('support.wallet.subscription.AI points click to read tip')}
+            onClick={() => {
+              router.push(AI_POINT_USAGE_CARD_ROUTE);
+            }}
+          ></QuestionTip>
         </Flex>
       </Flex>
       <Flex alignItems={'center'}>
diff --git a/projects/app/src/pages/account/components/BillTable.tsx b/projects/app/src/pages/account/components/BillTable.tsx
index d469fdc84..7484bca96 100644
--- a/projects/app/src/pages/account/components/BillTable.tsx
+++ b/projects/app/src/pages/account/components/BillTable.tsx
@@ -32,6 +32,7 @@ import { standardSubLevelMap, subModeMap } from '@fastgpt/global/support/wallet/
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const BillTable = () => {
   const { t } = useTranslation();
@@ -187,58 +188,68 @@ function BillDetailModal({ bill, onClose }: { bill: BillSchemaType; onClose: ()
     >
       <ModalBody>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Number')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Number')}:</FormLabel>
           <Box>{bill.orderId}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.usage.Time')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.usage.Time')}:</FormLabel>
           <Box>{dayjs(bill.createTime).format('YYYY/MM/DD HH:mm:ss')}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Status')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Status')}:</FormLabel>
           <Box>{t(billStatusMap[bill.status]?.label)}</Box>
         </Flex>
         {!!bill.metadata?.payWay && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.bill.payWay.Way')}:</Box>
+            <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.payWay.Way')}:</FormLabel>
             <Box>{t(billPayWayMap[bill.metadata.payWay]?.label)}</Box>
           </Flex>
         )}
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.Amount')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.Amount')}:</FormLabel>
           <Box>{formatStorePrice2Read(bill.price)}元</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Type')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Type')}:</FormLabel>
           <Box>{t(billTypeMap[bill.type]?.label)}</Box>
         </Flex>
         {!!bill.metadata?.subMode && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.mode.Period')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.mode.Period')}:
+            </FormLabel>
             <Box>{t(subModeMap[bill.metadata.subMode]?.label)}</Box>
           </Flex>
         )}
         {!!bill.metadata?.standSubLevel && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Stand plan level')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Stand plan level')}:
+            </FormLabel>
             <Box>{t(standardSubLevelMap[bill.metadata.standSubLevel]?.label)}</Box>
           </Flex>
         )}
         {bill.metadata?.month !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Month amount')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Month amount')}:
+            </FormLabel>
             <Box>{bill.metadata?.month}</Box>
           </Flex>
         )}
         {bill.metadata?.datasetSize !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Extra dataset size')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Extra dataset size')}:
+            </FormLabel>
             <Box>{bill.metadata?.datasetSize}</Box>
           </Flex>
         )}
         {bill.metadata?.extraPoints !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Extra ai points')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Extra ai points')}:
+            </FormLabel>
             <Box>{bill.metadata.extraPoints}</Box>
           </Flex>
         )}
diff --git a/projects/app/src/pages/account/components/Individuation.tsx b/projects/app/src/pages/account/components/Individuation.tsx
index bc1eabcd4..090d133f7 100644
--- a/projects/app/src/pages/account/components/Individuation.tsx
+++ b/projects/app/src/pages/account/components/Individuation.tsx
@@ -38,12 +38,12 @@ const Individuation = () => {
 
   return (
     <Box py={[3, '28px']} px={['5vw', '64px']}>
-      <Flex alignItems={'center'} fontSize={'xl'} h={'30px'}>
+      <Flex alignItems={'center'} fontSize={'lg'} h={'30px'}>
         <MyIcon mr={2} name={'support/user/individuation'} w={'20px'} />
         {t('support.account.Individuation')}
       </Flex>
 
-      <Card mt={6} px={[3, 10]} py={[3, 7]}>
+      <Card mt={6} px={[3, 10]} py={[3, 7]} fontSize={'sm'}>
         <Flex alignItems={'center'} w={['85%', '350px']}>
           <Box flex={'0 0 80px'}>{t('user.Language')}:&nbsp;</Box>
           <Box flex={'1 0 0'}>
diff --git a/projects/app/src/pages/account/components/Info.tsx b/projects/app/src/pages/account/components/Info.tsx
index 427907b32..8068bec77 100644
--- a/projects/app/src/pages/account/components/Info.tsx
+++ b/projects/app/src/pages/account/components/Info.tsx
@@ -9,7 +9,8 @@ import {
   Link,
   Progress,
   Grid,
-  Image
+  Image,
+  BoxProps
 } from '@chakra-ui/react';
 import { useForm } from 'react-hook-form';
 import { UserUpdateParams } from '@/types/user';
@@ -17,7 +18,6 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import type { UserType } from '@fastgpt/global/support/user/type.d';
 import { useQuery } from '@tanstack/react-query';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import dynamic from 'next/dynamic';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
@@ -25,7 +25,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useTranslation } from 'next-i18next';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useRouter } from 'next/router';
 import { formatStorePrice2Read } from '@fastgpt/global/support/wallet/usage/tools';
 import { putUpdateMemberName } from '@/web/support/user/team/api';
@@ -43,6 +43,7 @@ import {
 
 import StandardPlanContentList from '@/components/support/wallet/StandardPlanContentList';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const StandDetailModal = dynamic(() => import('./standardDetailModal'));
 const TeamMenu = dynamic(() => import('@/components/support/user/team/TeamMenu'));
@@ -158,20 +159,26 @@ const MyInfo = () => {
     [onclickSave, t, toast, userInfo]
   );
 
+  const labelStyles: BoxProps = {
+    flex: '0 0 80px',
+    fontSize: 'sm',
+    color: 'myGray.900'
+  };
+
   return (
     <Box>
       {/* user info */}
       {isPc && (
-        <Flex alignItems={'center'} fontSize={'xl'} h={'30px'}>
-          <MyIcon mr={2} name={'support/user/userLight'} w={'20px'} />
+        <Flex alignItems={'center'} fontSize={'md'} h={'30px'}>
+          <MyIcon mr={2} name={'support/user/userLight'} w={'1.25rem'} />
           {t('support.user.User self info')}
         </Flex>
       )}
 
-      <Box mt={[0, 6]}>
+      <Box mt={[0, 6]} fontSize={'sm'}>
         {isPc ? (
           <Flex alignItems={'center'} cursor={'pointer'}>
-            <Box flex={'0 0 80px'}>{t('support.user.Avatar')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('support.user.Avatar')}:&nbsp;</Box>
 
             <MyTooltip label={t('common.avatar.Select Avatar')}>
               <Box
@@ -219,7 +226,7 @@ const MyInfo = () => {
         )}
         {feConfigs.isPlus && (
           <Flex mt={[0, 4]} alignItems={'center'}>
-            <Box flex={'0 0 80px'}>{t('user.Member Name')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('user.Member Name')}:&nbsp;</Box>
             <Input
               flex={'1 0 0'}
               defaultValue={userInfo?.team?.memberName || 'Member'}
@@ -238,12 +245,12 @@ const MyInfo = () => {
           </Flex>
         )}
         <Flex alignItems={'center'} mt={6}>
-          <Box flex={'0 0 80px'}>{t('user.Account')}:&nbsp;</Box>
+          <Box {...labelStyles}>{t('user.Account')}:&nbsp;</Box>
           <Box flex={1}>{userInfo?.username}</Box>
         </Flex>
         {feConfigs.isPlus && (
           <Flex mt={6} alignItems={'center'}>
-            <Box flex={'0 0 80px'}>{t('user.Password')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('user.Password')}:&nbsp;</Box>
             <Box flex={1}>*****</Box>
             <Button size={'sm'} variant={'whitePrimary'} onClick={onOpenUpdatePsw}>
               {t('user.Change')}
@@ -251,7 +258,7 @@ const MyInfo = () => {
           </Flex>
         )}
         <Flex mt={6} alignItems={'center'}>
-          <Box flex={'0 0 80px'}>{t('user.Team')}:&nbsp;</Box>
+          <Box {...labelStyles}>{t('user.Team')}:&nbsp;</Box>
           <Box flex={1}>
             <TeamMenu />
           </Box>
@@ -259,9 +266,7 @@ const MyInfo = () => {
         {feConfigs.isPlus && (
           <Box mt={6} whiteSpace={'nowrap'}>
             <Flex alignItems={'center'}>
-              <Box flex={'0 0 80px'} fontSize={'md'}>
-                {t('user.team.Balance')}:&nbsp;
-              </Box>
+              <Box {...labelStyles}>{t('user.team.Balance')}:&nbsp;</Box>
               <Box flex={1}>
                 <strong>{formatStorePrice2Read(userInfo?.team?.balance).toFixed(3)}</strong> 元
               </Box>
@@ -373,7 +378,7 @@ const PlanUsage = () => {
 
   return standardPlan ? (
     <Box mt={[6, 0]}>
-      <Flex fontSize={'xl'} h={'30px'}>
+      <Flex fontSize={'lg'} h={'30px'}>
         <Flex alignItems={'center'}>
           <MyIcon mr={2} name={'support/account/plans'} w={'20px'} />
           {t('support.wallet.subscription.Team plan and usage')}
@@ -392,12 +397,12 @@ const PlanUsage = () => {
         borderColor={'borderColor.low'}
         borderRadius={'md'}
       >
-        <Flex px={[5, 10]} py={[3, 6]}>
+        <Flex px={[5, 7]} py={[3, 6]}>
           <Box flex={'1 0 0'}>
             <Box color={'myGray.600'} fontSize="sm">
               {t('support.wallet.subscription.Current plan')}
             </Box>
-            <Box fontWeight={'bold'} fontSize="xl">
+            <Box fontWeight={'bold'} fontSize="lg">
               {t(planName)}
             </Box>
 
@@ -412,18 +417,18 @@ const PlanUsage = () => {
                 </Box>
               </>
             ) : (
-              <Flex mt="2" color={'#485264'} fontSize="sm">
+              <Flex mt="2" color={'#485264'} fontSize="xs">
                 <Box>{t('support.wallet.Plan expired time')}:</Box>
                 <Box ml={2}>{formatTime2YMD(standardPlan?.expiredTime)}</Box>
               </Flex>
             )}
           </Box>
-          <Button onClick={() => router.push('/price')}>
+          <Button onClick={() => router.push('/price')} w={'8rem'} size="sm">
             {t('support.wallet.subscription.Upgrade plan')}
           </Button>
         </Flex>
         <Box py={3} borderTopWidth={'1px'} borderTopColor={'borderColor.base'}>
-          <Box py={[0, 3]} px={[5, 10]} overflow={'auto'}>
+          <Box py={[0, 3]} px={[5, 7]} overflow={'auto'}>
             <StandardPlanContentList
               level={standardPlan?.currentSubLevel}
               mode={standardPlan.currentMode}
@@ -443,8 +448,8 @@ const PlanUsage = () => {
       >
         <Flex>
           <Flex flex={'1 0 0'} alignItems={'flex-end'}>
-            <Box fontSize={'xl'}>资源用量</Box>
-            <Box fontSize={'sm'} color={'myGray.500'}>
+            <Box fontSize={'md'}>资源用量</Box>
+            <Box fontSize={'xs'} color={'myGray.500'}>
               (包含标准套餐与额外资源包)
             </Box>
           </Flex>
@@ -455,15 +460,18 @@ const PlanUsage = () => {
             alignItems={'center'}
             color={'primary.600'}
             cursor={'pointer'}
+            fontSize={'sm'}
           >
             购买额外套餐
             <MyIcon ml={1} name={'common/rightArrowLight'} w={'12px'} />
           </Link>
         </Flex>
-        <Box width={'100%'} mt={5}>
+        <Box width={'100%'} mt={5} fontSize={'sm'}>
           <Flex alignItems={'center'}>
             <Flex alignItems={'center'}>
-              <Box fontWeight={'bold'}>{t('support.user.team.Dataset usage')}</Box>
+              <Box fontWeight={'bold'} color={'myGray.900'}>
+                {t('support.user.team.Dataset usage')}
+              </Box>
               <Box color={'myGray.600'} ml={2}>
                 {datasetUsageMap.usedSize}/{datasetUsageMap.maxSize}
               </Box>
@@ -482,13 +490,16 @@ const PlanUsage = () => {
             />
           </Box>
         </Box>
-        <Box mt="9" width={'100%'}>
+        <Box mt="9" width={'100%'} fontSize={'sm'}>
           <Flex alignItems={'center'}>
             <Flex alignItems={'center'}>
-              <Box fontWeight={'bold'}>{t('support.wallet.subscription.AI points usage')}</Box>
-              <MyTooltip label={t('support.wallet.subscription.AI points usage tip')}>
-                <QuestionOutlineIcon ml={'2px'} />
-              </MyTooltip>
+              <Box fontWeight={'bold'} color={'myGray.900'}>
+                {t('support.wallet.subscription.AI points usage')}
+              </Box>
+              <QuestionTip
+                ml={1}
+                label={t('support.wallet.subscription.AI points usage tip')}
+              ></QuestionTip>
               <Box color={'myGray.600'} ml={2}>
                 {aiPointsUsageMap.used}/{aiPointsUsageMap.max}
               </Box>
@@ -557,6 +568,7 @@ const Other = () => {
             alignItems={'center'}
             userSelect={'none'}
             textDecoration={'none !important'}
+            fontSize={'sm'}
           >
             <MyIcon name={'common/courseLight'} w={'18px'} color={'myGray.600'} />
             <Box ml={2} flex={1}>
@@ -578,6 +590,7 @@ const Other = () => {
             alignItems={'center'}
             userSelect={'none'}
             textDecoration={'none !important'}
+            fontSize={'sm'}
           >
             <MyIcon name={'core/app/aiLight'} w={'18px'} />
             <Box ml={2} flex={1}>
@@ -589,7 +602,7 @@ const Other = () => {
         {feConfigs?.lafEnv && userInfo?.team.role === TeamMemberRoleEnum.owner && (
           <Flex
             bg={'white'}
-            py={4}
+            py={3}
             px={6}
             border={theme.borders.sm}
             borderWidth={'1.5px'}
@@ -598,6 +611,7 @@ const Other = () => {
             cursor={'pointer'}
             userSelect={'none'}
             onClick={onOpenLaf}
+            fontSize={'sm'}
           >
             <Image src="/imgs/workflow/laf.png" w={'18px'} alt="laf" />
             <Box ml={2} flex={1}>
@@ -615,7 +629,7 @@ const Other = () => {
         {feConfigs?.show_openai_account && (
           <Flex
             bg={'white'}
-            py={4}
+            py={3}
             px={6}
             border={theme.borders.sm}
             borderWidth={'1.5px'}
@@ -624,6 +638,7 @@ const Other = () => {
             cursor={'pointer'}
             userSelect={'none'}
             onClick={onOpenOpenai}
+            fontSize={'sm'}
           >
             <MyIcon name={'common/openai'} w={'18px'} color={'myGray.600'} />
             <Box ml={2} flex={1}>
@@ -644,6 +659,7 @@ const Other = () => {
             leftIcon={<MyIcon name={'modal/concat'} w={'18px'} color={'myGray.600'} />}
             onClick={onOpenConcat}
             h={'48px'}
+            fontSize={'sm'}
           >
             联系我们
           </Button>
diff --git a/projects/app/src/pages/account/components/InformTable.tsx b/projects/app/src/pages/account/components/InformTable.tsx
index 50d5ef66e..f8d2bf4b8 100644
--- a/projects/app/src/pages/account/components/InformTable.tsx
+++ b/projects/app/src/pages/account/components/InformTable.tsx
@@ -8,6 +8,7 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useTranslation } from 'next-i18next';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const InformTable = () => {
   const { t } = useTranslation();
@@ -78,14 +79,7 @@ const InformTable = () => {
             )}
           </Box>
         ))}
-        {!isLoading && informs.length === 0 && (
-          <Flex flex={'1 0 0'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-            <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-            <Box mt={2} color={'myGray.500'}>
-              暂无通知~
-            </Box>
-          </Flex>
-        )}
+        {!isLoading && informs.length === 0 && <EmptyTip text={'暂无通知~'}></EmptyTip>}
       </Box>
 
       {total > pageSize && (
diff --git a/projects/app/src/pages/account/components/Promotion.tsx b/projects/app/src/pages/account/components/Promotion.tsx
index abef37987..a94f05973 100644
--- a/projects/app/src/pages/account/components/Promotion.tsx
+++ b/projects/app/src/pages/account/components/Promotion.tsx
@@ -19,14 +19,15 @@ import { useQuery } from '@tanstack/react-query';
 import { getPromotionInitData, getPromotionRecords } from '@/web/support/activity/promotion/api';
 import { useUserStore } from '@/web/support/user/useUserStore';
 
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
 import type { PromotionRecordType } from '@/global/support/api/userRes.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import dayjs from 'dayjs';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const Promotion = () => {
   const { t } = useTranslation();
@@ -55,7 +56,7 @@ const Promotion = () => {
     p: [4, 5],
     border: theme.borders.base,
     textAlign: 'center',
-    fontSize: ['md', 'xl'],
+    fontSize: ['md', 'lg'],
     borderRadius: 'md'
   };
   const titleStyles: BoxProps = {
@@ -78,18 +79,14 @@ const Promotion = () => {
         <Box {...statisticsStyles}>
           <Flex alignItems={'center'} justifyContent={'center'}>
             <Box>{t('user.Promotion Rate')}</Box>
-            <MyTooltip label={t('user.Promotion rate tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('user.Promotion rate tip')}></QuestionTip>
           </Flex>
           <Box {...titleStyles}>{userInfo?.promotionRate || 15}%</Box>
         </Box>
         <Box {...statisticsStyles}>
           <Flex alignItems={'center'} justifyContent={'center'}>
             <Box>{t('user.Invite Url')}</Box>
-            <MyTooltip label={t('user.Invite url tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('user.Invite url tip')}></QuestionTip>
           </Flex>
           <Button
             mt={4}
@@ -127,14 +124,7 @@ const Promotion = () => {
           </Table>
         </TableContainer>
 
-        {!isLoading && promotionRecords.length === 0 && (
-          <Flex mt={'10vh'} flexDirection={'column'} alignItems={'center'}>
-            <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-            <Box mt={2} color={'myGray.500'}>
-              无邀请记录~
-            </Box>
-          </Flex>
-        )}
+        {!isLoading && promotionRecords.length === 0 && <EmptyTip text="无邀请记录~"></EmptyTip>}
         {total > pageSize && (
           <Flex mt={4} justifyContent={'flex-end'}>
             <Pagination />
diff --git a/projects/app/src/pages/account/components/UsageDetail.tsx b/projects/app/src/pages/account/components/UsageDetail.tsx
index 2acb11720..99bc6ebd4 100644
--- a/projects/app/src/pages/account/components/UsageDetail.tsx
+++ b/projects/app/src/pages/account/components/UsageDetail.tsx
@@ -17,6 +17,7 @@ import { UsageSourceMap } from '@fastgpt/global/support/wallet/usage/constants';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { formatNumber } from '@fastgpt/global/common/math/tools';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const UsageDetail = ({ usage, onClose }: { usage: UsageItemType; onClose: () => void }) => {
   const { t } = useTranslation();
@@ -67,30 +68,30 @@ const UsageDetail = ({ usage, onClose }: { usage: UsageItemType; onClose: () =>
     >
       <ModalBody>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.bill.Number')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.bill.Number')}:</FormLabel>
           <Box>{usage.id}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Time')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Time')}:</FormLabel>
           <Box>{dayjs(usage.time).format('YYYY/MM/DD HH:mm:ss')}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.App name')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.App name')}:</FormLabel>
           <Box>{t(usage.appName) || '-'}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Source')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Source')}:</FormLabel>
           <Box>{t(UsageSourceMap[usage.source]?.label)}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Total points')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Total points')}:</FormLabel>
           <Box fontWeight={'bold'}>{formatNumber(usage.totalPoints)}</Box>
         </Flex>
         <Box pb={4}>
-          <Box flex={'0 0 80px'} mb={1}>
+          <FormLabel flex={'0 0 80px'} mb={1}>
             {t('support.wallet.usage.Bill Module')}
-          </Box>
-          <TableContainer>
+          </FormLabel>
+          <TableContainer fontSize={'sm'}>
             <Table>
               <Thead>
                 <Tr>
diff --git a/projects/app/src/pages/account/components/UsageTable.tsx b/projects/app/src/pages/account/components/UsageTable.tsx
index 35d2f3770..c4e2fc55e 100644
--- a/projects/app/src/pages/account/components/UsageTable.tsx
+++ b/projects/app/src/pages/account/components/UsageTable.tsx
@@ -31,6 +31,7 @@ import { getTeamMembers } from '@/web/support/user/team/api';
 import Avatar from '@/components/Avatar';
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import { formatNumber } from '@fastgpt/global/common/math/tools';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 const UsageDetail = dynamic(() => import('./UsageDetail'));
 
 const UsageTable = () => {
@@ -130,7 +131,14 @@ const UsageTable = () => {
           <Pagination />
         </Flex>
       </Flex>
-      <TableContainer px={[3, 8]} position={'relative'} flex={'1 0 0'} h={0} overflowY={'auto'}>
+      <TableContainer
+        mt={2}
+        px={[3, 8]}
+        position={'relative'}
+        flex={'1 0 0'}
+        h={0}
+        overflowY={'auto'}
+      >
         <Table>
           <Thead>
             <Tr>
@@ -171,14 +179,7 @@ const UsageTable = () => {
         </Table>
       </TableContainer>
 
-      {!isLoading && usages.length === 0 && (
-        <Flex flex={'1 0 0'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            无使用记录~
-          </Box>
-        </Flex>
-      )}
+      {!isLoading && usages.length === 0 && <EmptyTip text="无使用记录~"></EmptyTip>}
 
       <Loading loading={isLoading} fixed={false} />
       {!!usageDetail && (
diff --git a/projects/app/src/pages/account/components/standardDetailModal.tsx b/projects/app/src/pages/account/components/standardDetailModal.tsx
index ae6070619..70ca2b513 100644
--- a/projects/app/src/pages/account/components/standardDetailModal.tsx
+++ b/projects/app/src/pages/account/components/standardDetailModal.tsx
@@ -45,7 +45,6 @@ const StandDetailModal = ({ onClose }: { onClose: () => void }) => {
                 <Th>{t('support.standard.AI Bonus Points')}</Th>
                 <Th>{t('support.standard.Start Time')}</Th>
                 <Th>{t('support.standard.Expired Time')}</Th>
-                <Th />
               </Tr>
             </Thead>
             <Tbody fontSize={'sm'}>
diff --git a/projects/app/src/pages/api/common/file/previewContent.ts b/projects/app/src/pages/api/common/file/previewContent.ts
index ba17ebb7e..40d70f84f 100644
--- a/projects/app/src/pages/api/common/file/previewContent.ts
+++ b/projects/app/src/pages/api/common/file/previewContent.ts
@@ -39,12 +39,10 @@ async function handler(req: ApiRequestProps<PreviewContextProps>, res: NextApiRe
     selector
   });
 
-  jsonRes(res, {
-    data: {
-      previewContent: rawText.slice(0, 3000),
-      totalLength: rawText.length
-    }
-  });
+  return {
+    previewContent: rawText.slice(0, 3000),
+    totalLength: rawText.length
+  };
 }
 
 export default NextAPI(handler);
diff --git a/projects/app/src/pages/app/detail/components/FlowEdit/Header.tsx b/projects/app/src/pages/app/detail/components/FlowEdit/Header.tsx
index 229914b0b..088148a57 100644
--- a/projects/app/src/pages/app/detail/components/FlowEdit/Header.tsx
+++ b/projects/app/src/pages/app/detail/components/FlowEdit/Header.tsx
@@ -224,13 +224,13 @@ const RenderHeaderContainer = React.memo(function RenderHeaderContainer({
             onClick={saveAndBack}
           />
           <Box ml={[2, 4]}>
-            <Box fontSize={['md', 'lg']} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               {appDetail.name}
             </Box>
             {!isShowVersionHistories && isV2Workflow && (
               <MyTooltip label={t('core.app.Onclick to save')}>
                 <Box
-                  fontSize={'sm'}
+                  fontSize={'xs'}
                   mt={1}
                   display={'inline-block'}
                   borderRadius={'xs'}
@@ -260,14 +260,18 @@ const RenderHeaderContainer = React.memo(function RenderHeaderContainer({
                 }
                 menuList={[
                   {
-                    label: appT('Import Configs'),
-                    icon: 'common/importLight',
-                    onClick: onOpenImport
-                  },
-                  {
-                    label: appT('Export Configs'),
-                    icon: 'export',
-                    onClick: onExportWorkflow
+                    children: [
+                      {
+                        label: appT('Import Configs'),
+                        icon: 'common/importLight',
+                        onClick: onOpenImport
+                      },
+                      {
+                        label: appT('Export Configs'),
+                        icon: 'export',
+                        onClick: onExportWorkflow
+                      }
+                    ]
                   }
                 ]}
               />
diff --git a/projects/app/src/pages/app/detail/components/InfoModal.tsx b/projects/app/src/pages/app/detail/components/InfoModal.tsx
index ea29db4e4..43d615ae0 100644
--- a/projects/app/src/pages/app/detail/components/InfoModal.tsx
+++ b/projects/app/src/pages/app/detail/components/InfoModal.tsx
@@ -145,7 +145,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
       title={t('core.app.setting')}
     >
       <ModalBody>
-        <Box>{t('core.app.Name and avatar')}</Box>
+        <Box fontSize={'sm'}>{t('core.app.Name and avatar')}</Box>
         <Flex mt={2} alignItems={'center'}>
           <Avatar
             src={avatar}
@@ -167,7 +167,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
             ></Input>
           </FormControl>
         </Flex>
-        <Box mt={4} mb={1}>
+        <Box mt={4} mb={1} fontSize={'sm'}>
           {t('core.app.App intro')}
         </Box>
         <Textarea
@@ -183,7 +183,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
           <>
             {' '}
             <Box mt="4">
-              <Box>{t('permission.Default permission')}</Box>
+              <Box fontSize={'sm'}>{t('permission.Default permission')}</Box>
               <DefaultPermissionList
                 mt="2"
                 per={defaultPermission}
diff --git a/projects/app/src/pages/app/detail/components/Logs.tsx b/projects/app/src/pages/app/detail/components/Logs.tsx
index 0e358c0fb..34c8aa82d 100644
--- a/projects/app/src/pages/app/detail/components/Logs.tsx
+++ b/projects/app/src/pages/app/detail/components/Logs.tsx
@@ -25,7 +25,7 @@ import ChatBox from '@/components/ChatBox';
 import type { ComponentRef } from '@/components/ChatBox/type.d';
 import { useQuery } from '@tanstack/react-query';
 import { getInitChatInfo } from '@/web/core/chat/api';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { addDays } from 'date-fns';
 import MyBox from '@fastgpt/web/components/common/MyBox';
@@ -34,6 +34,7 @@ import DateRangePicker, { DateRangeType } from '@fastgpt/web/components/common/D
 import { formatChatValue2InputType } from '@/components/ChatBox/utils';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
 import { useI18n } from '@/web/context/I18n';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const Logs = ({ appId }: { appId: string }) => {
   const { t } = useTranslation();
@@ -75,7 +76,7 @@ const Logs = ({ appId }: { appId: string }) => {
       <Box px={[4, 8]}>
         {isPc && (
           <>
-            <Box fontWeight={'bold'} fontSize={['md', 'xl']} mb={2}>
+            <Box fontWeight={'bold'} fontSize={['md', 'lg']} mb={2}>
               {appT('Chat logs')}
             </Box>
             <Box color={'myGray.500'} fontSize={'sm'}>
@@ -175,14 +176,7 @@ const Logs = ({ appId }: { appId: string }) => {
           </Tbody>
         </Table>
       </TableContainer>
-      {logs.length === 0 && !isLoading && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {appT('Logs Empty')}
-          </Box>
-        </Flex>
-      )}
+      {logs.length === 0 && !isLoading && <EmptyTip text={appT('Logs Empty')}></EmptyTip>}
       <Flex w={'100%'} p={4} alignItems={'center'} justifyContent={'flex-end'}>
         <DateRangePicker
           defaultDate={dateRange}
@@ -292,15 +286,15 @@ const DetailLogsModal = ({
               <Box mr={3} color={'myGray.1000'}>
                 {title}
               </Box>
-              <Tag>
+              <MyTag colorSchema="blue">
                 <MyIcon name={'history'} w={'14px'} />
                 <Box ml={1}>{`${history.length}条记录`}</Box>
-              </Tag>
+              </MyTag>
               {!!chatModels && chatModels.length > 0 && (
-                <Tag ml={2} colorSchema={'green'}>
+                <MyTag ml={2} colorSchema={'green'}>
                   <MyIcon name={'core/chat/chatModelTag'} w={'14px'} />
                   <Box ml={1}>{chatModels.join(',')}</Box>
-                </Tag>
+                </MyTag>
               )}
               <Box flex={1} />
             </>
diff --git a/projects/app/src/pages/app/detail/components/Publish/FeiShu/FeiShuEditModal.tsx b/projects/app/src/pages/app/detail/components/Publish/FeiShu/FeiShuEditModal.tsx
index 80930ad8c..17fe477a2 100644
--- a/projects/app/src/pages/app/detail/components/Publish/FeiShu/FeiShuEditModal.tsx
+++ b/projects/app/src/pages/app/detail/components/Publish/FeiShu/FeiShuEditModal.tsx
@@ -1,8 +1,7 @@
 import React, { useMemo } from 'react';
 import { Flex, Box, Button, ModalFooter, ModalBody, Input } from '@chakra-ui/react';
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { PublishChannelEnum } from '@fastgpt/global/support/outLink/constant';
 import type { FeishuType, OutLinkEditType } from '@fastgpt/global/support/outLink/type';
 import { useTranslation } from 'next-i18next';
@@ -11,6 +10,7 @@ import { useRequest } from '@/web/common/hooks/useRequest';
 import dayjs from 'dayjs';
 import { createShareChat, updateShareChat } from '@/web/support/outLink/api';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const FeiShuEditModal = ({
   appId,
@@ -76,9 +76,7 @@ const FeiShuEditModal = ({
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
             QPM
-            <MyTooltip label={publishT('QPM Tips' || '')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={publishT('QPM Tips' || '')}></QuestionTip>
           </Flex>
           <Input
             max={1000}
@@ -93,9 +91,7 @@ const FeiShuEditModal = ({
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
             {t('support.outlink.Max usage points')}
-            <MyTooltip label={t('support.outlink.Max usage points tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('support.outlink.Max usage points tip')}></QuestionTip>
           </Flex>
           <Input
             {...register('limit.maxUsagePoints', {
diff --git a/projects/app/src/pages/app/detail/components/Publish/FeiShu/index.tsx b/projects/app/src/pages/app/detail/components/Publish/FeiShu/index.tsx
index 41e8eb4d8..0d89a6226 100644
--- a/projects/app/src/pages/app/detail/components/Publish/FeiShu/index.tsx
+++ b/projects/app/src/pages/app/detail/components/Publish/FeiShu/index.tsx
@@ -26,6 +26,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import dayjs from 'dayjs';
 import dynamic from 'next/dynamic';
 import MyMenu from '@fastgpt/web/components/common/MyMenu';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const FeiShuEditModal = dynamic(() => import('./FeiShuEditModal'));
 
@@ -47,7 +48,7 @@ const FeiShu = ({ appId }: { appId: string }) => {
   return (
     <Box position={'relative'} pt={3} px={5} minH={'50vh'}>
       <Flex justifyContent={'space-between'}>
-        <Box fontWeight={'bold'} fontSize={['md', 'xl']}>
+        <Box fontWeight={'bold'} fontSize={['md', 'lg']}>
           {t('core.app.publish.Fei shu bot publish')}
         </Box>
         <Button
@@ -122,32 +123,36 @@ const FeiShu = ({ appId }: { appId: string }) => {
                     }
                     menuList={[
                       {
-                        label: t('common.Edit'),
-                        icon: 'edit',
-                        onClick: () =>
-                          setEditFeiShuLinkData({
-                            _id: item._id,
-                            name: item.name,
-                            limit: item.limit,
-                            app: item.app,
-                            responseDetail: item.responseDetail,
-                            defaultResponse: item.defaultResponse,
-                            immediateResponse: item.immediateResponse
-                          })
-                      },
-                      {
-                        label: t('common.Delete'),
-                        icon: 'delete',
-                        onClick: async () => {
-                          setIsLoading(true);
-                          try {
-                            await delShareChatById(item._id);
-                            refetchShareChatList();
-                          } catch (error) {
-                            console.log(error);
+                        children: [
+                          {
+                            label: t('common.Edit'),
+                            icon: 'edit',
+                            onClick: () =>
+                              setEditFeiShuLinkData({
+                                _id: item._id,
+                                name: item.name,
+                                limit: item.limit,
+                                app: item.app,
+                                responseDetail: item.responseDetail,
+                                defaultResponse: item.defaultResponse,
+                                immediateResponse: item.immediateResponse
+                              })
+                          },
+                          {
+                            label: t('common.Delete'),
+                            icon: 'delete',
+                            onClick: async () => {
+                              setIsLoading(true);
+                              try {
+                                await delShareChatById(item._id);
+                                refetchShareChatList();
+                              } catch (error) {
+                                console.log(error);
+                              }
+                              setIsLoading(false);
+                            }
                           }
-                          setIsLoading(false);
-                        }
+                        ]
                       }
                     ]}
                   />
@@ -178,12 +183,7 @@ const FeiShu = ({ appId }: { appId: string }) => {
         />
       )}
       {shareChatList.length === 0 && !isFetching && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.app.share.Not share link')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.app.share.Not share link')}></EmptyTip>
       )}
       <Loading loading={isFetching} fixed={false} />
     </Box>
diff --git a/projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx b/projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx
index a3a8c0775..574a5372d 100644
--- a/projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx
+++ b/projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx
@@ -139,7 +139,12 @@ console.log("Chat box loaded")
         />
 
         {/* config */}
-        <Grid gridTemplateColumns={['repeat(2,1fr)', 'repeat(3,1fr)']} gridGap={4} my={5}>
+        <Grid
+          gridTemplateColumns={['repeat(2,1fr)', 'repeat(3,1fr)']}
+          gridGap={4}
+          my={5}
+          fontSize={'sm'}
+        >
           <Flex {...gridItemStyle}>
             <Box flex={1}>{t('core.app.outLink.Show History')}</Box>
             <Switch {...register('showHistory')} />
@@ -181,7 +186,7 @@ console.log("Chat box loaded")
         </Grid>
 
         {/* code */}
-        <Box borderRadius={'md'} bg={'myGray.100'} overflow={'hidden'}>
+        <Box borderRadius={'md'} bg={'myGray.100'} overflow={'hidden'} fontSize={'sm'}>
           <Flex
             p={3}
             bg={'myWhite.500'}
diff --git a/projects/app/src/pages/app/detail/components/Publish/Link/index.tsx b/projects/app/src/pages/app/detail/components/Publish/Link/index.tsx
index eec3cc046..08a411b01 100644
--- a/projects/app/src/pages/app/detail/components/Publish/Link/index.tsx
+++ b/projects/app/src/pages/app/detail/components/Publish/Link/index.tsx
@@ -15,9 +15,9 @@ import {
   Input,
   Switch,
   Link,
-  IconButton
+  IconButton,
+  HStack
 } from '@chakra-ui/react';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useQuery } from '@tanstack/react-query';
@@ -37,7 +37,6 @@ import { PublishChannelEnum } from '@fastgpt/global/support/outLink/constant';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
-import MyTooltip from '@/components/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import dayjs from 'dayjs';
 import { getDocPath } from '@/web/common/system/doc';
@@ -45,6 +44,9 @@ import dynamic from 'next/dynamic';
 import MyMenu from '@fastgpt/web/components/common/MyMenu';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const SelectUsingWayModal = dynamic(() => import('./SelectUsingWayModal'));
 
@@ -72,12 +74,12 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
   return (
     <Box position={'relative'} pt={3} px={5} minH={'50vh'}>
       <Flex justifyContent={'space-between'}>
-        <Box fontWeight={'bold'} fontSize={['md', 'xl']}>
-          {t('core.app.Share link')}
-          <MyTooltip forceShow label={t('core.app.Share link desc detail')}>
-            <QuestionOutlineIcon ml={1} />
-          </MyTooltip>
-        </Box>
+        <HStack>
+          <Box color={'myGray.900'} fontSize={'lg'}>
+            {t('core.app.Share link')}
+          </Box>
+          <QuestionTip label={t('core.app.Share link desc detail')} />
+        </HStack>
         <Button
           variant={'whitePrimary'}
           colorScheme={'blue'}
@@ -168,31 +170,35 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
                     }
                     menuList={[
                       {
-                        label: t('common.Edit'),
-                        icon: 'edit',
-                        onClick: () =>
-                          setEditLinkData({
-                            _id: item._id,
-                            name: item.name,
-                            responseDetail: item.responseDetail,
-                            limit: item.limit
-                          })
-                      },
-                      {
-                        label: t('common.Delete'),
-                        icon: 'delete',
-                        type: 'danger',
-                        onClick: () =>
-                          openConfirm(async () => {
-                            setIsLoading(true);
-                            try {
-                              await delShareChatById(item._id);
-                              refetchShareChatList();
-                            } catch (error) {
-                              console.log(error);
-                            }
-                            setIsLoading(false);
-                          })()
+                        children: [
+                          {
+                            label: t('common.Edit'),
+                            icon: 'edit',
+                            onClick: () =>
+                              setEditLinkData({
+                                _id: item._id,
+                                name: item.name,
+                                responseDetail: item.responseDetail,
+                                limit: item.limit
+                              })
+                          },
+                          {
+                            label: t('common.Delete'),
+                            icon: 'delete',
+                            type: 'danger',
+                            onClick: () =>
+                              openConfirm(async () => {
+                                setIsLoading(true);
+                                try {
+                                  await delShareChatById(item._id);
+                                  refetchShareChatList();
+                                } catch (error) {
+                                  console.log(error);
+                                }
+                                setIsLoading(false);
+                              })()
+                          }
+                        ]
                       }
                     ]}
                   />
@@ -204,12 +210,7 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
       </TableContainer>
 
       {shareChatList.length === 0 && !isFetching && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.app.share.Not share link')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.app.share.Not share link')} />
       )}
       {!!editLinkData && (
         <EditLinkModal
@@ -300,7 +301,7 @@ function EditLinkModal({
     >
       <ModalBody>
         <Flex alignItems={'center'}>
-          <Box flex={'0 0 90px'}>{t('Name')}</Box>
+          <FormLabel flex={'0 0 90px'}>{t('Name')}</FormLabel>
           <Input
             placeholder={publishT('Link Name')}
             maxLength={20}
@@ -312,9 +313,9 @@ function EditLinkModal({
         {feConfigs?.isPlus && (
           <>
             <Flex alignItems={'center'} mt={4}>
-              <Flex flex={'0 0 90px'} alignItems={'center'}>
+              <FormLabel flex={'0 0 90px'} alignItems={'center'}>
                 {t('common.Expired Time')}
-              </Flex>
+              </FormLabel>
               <Input
                 type="datetime-local"
                 defaultValue={
@@ -329,10 +330,8 @@ function EditLinkModal({
             </Flex>
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                QPM
-                <MyTooltip label={publishT('QPM Tips' || '')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>QPM</FormLabel>
+                <QuestionTip ml={1} label={publishT('QPM Tips' || '')}></QuestionTip>
               </Flex>
               <Input
                 max={1000}
@@ -346,10 +345,8 @@ function EditLinkModal({
             </Flex>
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {t('support.outlink.Max usage points')}
-                <MyTooltip label={t('support.outlink.Max usage points tip')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>{t('support.outlink.Max usage points')}</FormLabel>
+                <QuestionTip ml={1} label={t('support.outlink.Max usage points tip')}></QuestionTip>
               </Flex>
               <Input
                 {...register('limit.maxUsagePoints', {
@@ -363,10 +360,8 @@ function EditLinkModal({
 
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {publishT('token auth')}
-                <MyTooltip label={publishT('token auth Tips') || ''}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>{publishT('token auth')}</FormLabel>
+                <QuestionTip ml={1} label={publishT('token auth Tips') || ''}></QuestionTip>
               </Flex>
               <Input
                 placeholder={publishT('token auth Tips') || ''}
@@ -377,7 +372,7 @@ function EditLinkModal({
             <Link
               href={getDocPath('/docs/development/openapi/share')}
               target={'_blank'}
-              fontSize={'sm'}
+              fontSize={'xs'}
               color={'myGray.500'}
             >
               {publishT('token auth use cases')}
@@ -387,12 +382,13 @@ function EditLinkModal({
 
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
-            {t('support.outlink.share.Response Quote')}
-            <MyTooltip label={t('support.outlink.share.Response Quote tips' || '')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <FormLabel>{t('support.outlink.share.Response Quote')}</FormLabel>
+            <QuestionTip
+              ml={1}
+              label={t('support.outlink.share.Response Quote tips' || '')}
+            ></QuestionTip>
           </Flex>
-          <Switch {...register('responseDetail')} size={'lg'} />
+          <Switch {...register('responseDetail')} />
         </Flex>
       </ModalBody>
 
diff --git a/projects/app/src/pages/app/detail/components/Publish/index.tsx b/projects/app/src/pages/app/detail/components/Publish/index.tsx
index 32fe240c5..55d84427d 100644
--- a/projects/app/src/pages/app/detail/components/Publish/index.tsx
+++ b/projects/app/src/pages/app/detail/components/Publish/index.tsx
@@ -39,12 +39,12 @@ const OutLink = ({ appId }: { appId: string }) => {
 
   return (
     <Box pt={[1, 5]}>
-      <Box fontWeight={'bold'} fontSize={['md', 'xl']} mb={2} px={[4, 8]}>
+      <Box color={'myGray.900'} fontSize={'lg'} mb={2} px={[4, 8]}>
         {t('core.app.navbar.Publish app')}
       </Box>
       <Box pb={[5, 7]} px={[4, 8]} borderBottom={theme.borders.base}>
         <MyRadio
-          gridTemplateColumns={['repeat(1,1fr)', 'repeat(auto-fill, minmax(0, 300px))']}
+          gridTemplateColumns={['repeat(1,1fr)', 'repeat(auto-fill, minmax(0, 400px))']}
           iconSize={'20px'}
           list={publishList.current}
           value={linkType}
diff --git a/projects/app/src/pages/app/detail/components/SimpleEdit/AppCard.tsx b/projects/app/src/pages/app/detail/components/SimpleEdit/AppCard.tsx
index 224a1309f..c328936aa 100644
--- a/projects/app/src/pages/app/detail/components/SimpleEdit/AppCard.tsx
+++ b/projects/app/src/pages/app/detail/components/SimpleEdit/AppCard.tsx
@@ -63,10 +63,10 @@ const AppCard = () => {
     <>
       <Box px={4}>
         <Flex alignItems={'center'} justifyContent={'space-between'}>
-          <Box fontSize={['md', 'xl']} fontWeight={'bold'}>
-            <PermissionIconText defaultPermission={appDetail.defaultPermission} />
+          <Box fontWeight={'bold'}>
+            <PermissionIconText defaultPermission={appDetail.defaultPermission} fontSize={'md'} />
           </Box>
-          <Box color={'myGray.500'} fontSize={'sm'}>
+          <Box color={'myGray.500'} fontSize={'xs'}>
             AppId:{' '}
             <Box as={'span'} userSelect={'all'}>
               {appId}
@@ -84,9 +84,9 @@ const AppCard = () => {
           bg={'primary.50'}
           position={'relative'}
         >
-          <Flex alignItems={'center'} py={2}>
+          <Flex alignItems={'center'}>
             <Avatar src={appDetail.avatar} borderRadius={'md'} w={'28px'} />
-            <Box ml={3} fontWeight={'bold'} fontSize={'lg'}>
+            <Box ml={3} fontWeight={'bold'} fontSize={'md'}>
               {appDetail.name}
             </Box>
             {appDetail.permission.isOwner && (
@@ -107,10 +107,12 @@ const AppCard = () => {
           </Flex>
           <Box
             flex={1}
-            my={2}
+            mt={3}
+            mb={4}
             className={'textEllipsis3'}
             wordBreak={'break-all'}
             color={'myGray.600'}
+            fontSize={'xs'}
           >
             {appDetail.intro || t('core.app.tip.Add a intro to app')}
           </Box>
diff --git a/projects/app/src/pages/app/detail/components/SimpleEdit/ChatTest.tsx b/projects/app/src/pages/app/detail/components/SimpleEdit/ChatTest.tsx
index dde8134ad..fc5a413be 100644
--- a/projects/app/src/pages/app/detail/components/SimpleEdit/ChatTest.tsx
+++ b/projects/app/src/pages/app/detail/components/SimpleEdit/ChatTest.tsx
@@ -5,9 +5,8 @@ import React, { useCallback, useEffect, useRef } from 'react';
 import ChatBox from '@/components/ChatBox';
 import type { ComponentRef, StartChatFnProps } from '@/components/ChatBox/type.d';
 import { streamFetch } from '@/web/common/api/fetch';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import { getGuideModule } from '@fastgpt/global/core/workflow/utils';
 import { checkChatSupportSelectFileByModules } from '@/web/core/chat/utils';
 import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
 import {
@@ -104,7 +103,7 @@ const ChatTest = ({
       bg={'white'}
     >
       <Flex px={[2, 5]}>
-        <Box fontSize={['md', 'xl']} fontWeight={'bold'} flex={1}>
+        <Box fontSize={['md', 'lg']} fontWeight={'bold'} flex={1}>
           {appT('Chat Debug')}
         </Box>
         <MyTooltip label={t('core.chat.Restart')}>
@@ -151,7 +150,7 @@ const ChatTest = ({
           whiteSpace={'pre-wrap'}
           textAlign={'center'}
         >
-          <Box>{appT('Advance App TestTip')}</Box>
+          <Box fontSize={'md'}>{appT('Advance App TestTip')}</Box>
         </Flex>
       )}
     </Flex>
diff --git a/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx b/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx
index e069e763d..6e652d5e9 100644
--- a/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx
+++ b/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx
@@ -1,6 +1,15 @@
 import React, { useEffect, useMemo, useTransition } from 'react';
-import { Box, Flex, Grid, BoxProps, useTheme, useDisclosure, Button } from '@chakra-ui/react';
-import { AddIcon, QuestionOutlineIcon, SmallAddIcon } from '@chakra-ui/icons';
+import {
+  Box,
+  Flex,
+  Grid,
+  BoxProps,
+  useTheme,
+  useDisclosure,
+  Button,
+  HStack
+} from '@chakra-ui/react';
+import { AddIcon, SmallAddIcon } from '@chakra-ui/icons';
 import { useFieldArray, UseFormReturn } from 'react-hook-form';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import type { AppSimpleEditFormType } from '@fastgpt/global/core/app/type.d';
@@ -13,7 +22,7 @@ import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import { form2AppWorkflow } from '@/web/core/app/utils';
 
 import dynamic from 'next/dynamic';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import VariableEdit from '@/components/core/app/VariableEdit';
@@ -30,6 +39,8 @@ import { useUpdate } from 'ahooks';
 import { useI18n } from '@/web/context/I18n';
 import { useContextSelector } from 'use-context-selector';
 import { AppContext } from '@/web/core/app/context/appContext';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const DatasetSelectModal = dynamic(() => import('@/components/core/app/DatasetSelectModal'));
 const DatasetParamsModal = dynamic(() => import('@/components/core/app/DatasetParamsModal'));
@@ -52,7 +63,7 @@ const BoxStyles: BoxProps = {
 const LabelStyles: BoxProps = {
   w: ['60px', '100px'],
   flexShrink: 0,
-  fontSize: ['sm', 'md']
+  fontSize: 'xs'
 };
 
 const EditForm = ({
@@ -172,14 +183,10 @@ const EditForm = ({
           boxShadow: '0 2px 10px rgba(0,0,0,0.12)'
         })}
       >
-        <Flex alignItems={'center'}>
-          <Box fontSize={['md', 'xl']} color={'myGray.800'}>
-            {t('core.app.App params config')}
-          </Box>
-          <MyTooltip label={t('core.app.Simple Config Tip')} forceShow>
-            <MyIcon name={'common/questionLight'} color={'myGray.500'} ml={2} />
-          </MyTooltip>
-        </Flex>
+        <HStack>
+          <Box color={'myGray.900'}>{t('core.app.App params config')}</Box>
+          <QuestionTip label={t('core.app.Simple Config Tip')} />
+        </HStack>
         <Button
           isLoading={isSaving}
           size={['sm', 'md']}
@@ -209,9 +216,9 @@ const EditForm = ({
           <Box {...BoxStyles}>
             <Flex alignItems={'center'}>
               <MyIcon name={'core/app/simpleMode/ai'} w={'20px'} />
-              <Box ml={2} flex={1}>
+              <FormLabel ml={2} flex={1}>
                 {appT('AI Settings')}
-              </Box>
+              </FormLabel>
             </Flex>
             <Flex alignItems={'center'} mt={5}>
               <Box {...LabelStyles}>{t('core.ai.Model')}</Box>
@@ -235,12 +242,10 @@ const EditForm = ({
             </Flex>
 
             <Box mt={3}>
-              <Box {...LabelStyles}>
-                {t('core.ai.Prompt')}
-                <MyTooltip label={t('core.app.tip.chatNodeSystemPromptTip')} forceShow>
-                  <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-                </MyTooltip>
-              </Box>
+              <HStack {...LabelStyles}>
+                <Box>{t('core.ai.Prompt')}</Box>
+                <QuestionTip label={t('core.app.tip.chatNodeSystemPromptTip')} />
+              </HStack>
               <Box mt={1}>
                 <PromptEditor
                   value={aiSystemPrompt}
@@ -262,14 +267,14 @@ const EditForm = ({
             <Flex alignItems={'center'}>
               <Flex alignItems={'center'} flex={1}>
                 <MyIcon name={'core/app/simpleMode/dataset'} w={'20px'} />
-                <Box ml={2}>{t('core.dataset.Choose Dataset')}</Box>
+                <FormLabel ml={2}>{t('core.dataset.Choose Dataset')}</FormLabel>
               </Flex>
               <Button
                 variant={'transparentBase'}
-                leftIcon={<AddIcon fontSize={'xs'} />}
+                leftIcon={<SmallAddIcon />}
                 iconSpacing={1}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenKbSelect}
               >
                 {t('common.Choose')}
@@ -279,7 +284,7 @@ const EditForm = ({
                 leftIcon={<MyIcon name={'edit'} w={'14px'} />}
                 iconSpacing={1}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenDatasetParams}
               >
                 {t('common.Params')}
@@ -335,10 +340,8 @@ const EditForm = ({
             <Flex alignItems={'center'}>
               <Flex alignItems={'center'} flex={1}>
                 <MyIcon name={'core/app/toolCall'} w={'20px'} />
-                <Box ml={2}>{t('core.app.Tool call')}(实验功能)</Box>
-                <MyTooltip label={t('core.app.Tool call tip')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel ml={2}>{t('core.app.Tool call')}(实验功能)</FormLabel>
+                <QuestionTip ml={1} label={t('core.app.Tool call tip')} />
               </Flex>
               <Button
                 variant={'transparentBase'}
@@ -346,7 +349,7 @@ const EditForm = ({
                 iconSpacing={1}
                 mr={'-5px'}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenToolsSelect}
               >
                 {t('common.Choose')}
@@ -434,7 +437,6 @@ const EditForm = ({
           <Box {...BoxStyles}>
             <QGSwitch
               isChecked={postQuestionGuide}
-              size={'lg'}
               onChange={(e) => {
                 setValue('chatConfig.questionGuide', e.target.checked);
               }}
diff --git a/projects/app/src/pages/app/detail/components/SimpleEdit/ToolSelectModal.tsx b/projects/app/src/pages/app/detail/components/SimpleEdit/ToolSelectModal.tsx
index d9194272c..61edf9e6a 100644
--- a/projects/app/src/pages/app/detail/components/SimpleEdit/ToolSelectModal.tsx
+++ b/projects/app/src/pages/app/detail/components/SimpleEdit/ToolSelectModal.tsx
@@ -341,7 +341,7 @@ const RenderList = React.memo(function RenderList({
                         );
                       }
                       if (input.valueType === WorkflowIOValueTypeEnum.boolean) {
-                        return <Switch size={'lg'} {...register(input.key, { required })} />;
+                        return <Switch {...register(input.key, { required })} />;
                       }
                       return (
                         <JsonEditor
diff --git a/projects/app/src/pages/app/detail/index.tsx b/projects/app/src/pages/app/detail/index.tsx
index a2fb1f4d7..a27b17d09 100644
--- a/projects/app/src/pages/app/detail/index.tsx
+++ b/projects/app/src/pages/app/detail/index.tsx
@@ -100,7 +100,7 @@ const AppDetail = ({ appId, currentTab }: { appId: string; currentTab: TabEnum }
             >
               <Flex mb={4} alignItems={'center'}>
                 <Avatar src={appDetail.avatar} w={'34px'} borderRadius={'md'} />
-                <Box ml={2} fontWeight={'bold'}>
+                <Box ml={2} fontSize={'sm'} fontWeight={'bold'}>
                   {appDetail.name}
                 </Box>
               </Flex>
@@ -142,7 +142,7 @@ const AppDetail = ({ appId, currentTab }: { appId: string; currentTab: TabEnum }
             </Box>
             {/* phone tab */}
             <Box display={['block', 'none']} textAlign={'center'} py={3}>
-              <Box className="textlg" fontSize={'xl'} fontWeight={'bold'}>
+              <Box className="textlg" fontSize={'lg'} fontWeight={'bold'}>
                 {appDetail.name}
               </Box>
               <Tabs
diff --git a/projects/app/src/pages/app/list/component/CreateModal.tsx b/projects/app/src/pages/app/list/component/CreateModal.tsx
index 6a17d32b7..c207fc912 100644
--- a/projects/app/src/pages/app/list/component/CreateModal.tsx
+++ b/projects/app/src/pages/app/list/component/CreateModal.tsx
@@ -21,7 +21,7 @@ import { appTemplates } from '@/web/core/app/templates';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
@@ -110,7 +110,7 @@ const CreateModal = ({ onClose, onSuccess }: { onClose: () => void; onSuccess: (
         <Box color={'myGray.800'} fontWeight={'bold'}>
           {t('common.Set Name')}
         </Box>
-        <Flex mt={3} alignItems={'center'}>
+        <Flex mt={2} alignItems={'center'}>
           <MyTooltip label={t('common.Set Avatar')}>
             <Avatar
               flexShrink={0}
@@ -164,11 +164,11 @@ const CreateModal = ({ onClose, onSuccess }: { onClose: () => void; onSuccess: (
             >
               <Flex alignItems={'center'}>
                 <Avatar src={item.avatar} borderRadius={'md'} w={'20px'} />
-                <Box ml={3} fontWeight={'bold'}>
+                <Box ml={3} color={'myGray.900'}>
                   {t(item.name)}
                 </Box>
               </Flex>
-              <Box fontSize={'sm'} mt={4}>
+              <Box fontSize={'xs'} mt={2} color={'myGray.600'}>
                 {t(item.intro)}
               </Box>
             </Card>
diff --git a/projects/app/src/pages/app/list/index.tsx b/projects/app/src/pages/app/list/index.tsx
index 7cf32c1e5..825e5aed2 100644
--- a/projects/app/src/pages/app/list/index.tsx
+++ b/projects/app/src/pages/app/list/index.tsx
@@ -10,13 +10,14 @@ import { serviceSideProps } from '@/web/common/utils/i18n';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import PageContainer from '@/components/PageContainer';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import CreateModal from './component/CreateModal';
 import { useAppStore } from '@/web/core/app/store/useAppStore';
 import PermissionIconText from '@/components/support/permission/IconText';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useI18n } from '@/web/context/I18n';
 import { useTranslation } from 'next-i18next';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const MyApps = () => {
   const { t } = useTranslation();
@@ -141,7 +142,7 @@ const MyApps = () => {
                 className={'textEllipsis3'}
                 py={2}
                 wordBreak={'break-all'}
-                fontSize={'sm'}
+                fontSize={'xs'}
                 color={'myGray.600'}
               >
                 {app.intro || '这个应用还没写介绍~'}
@@ -177,14 +178,7 @@ const MyApps = () => {
         ))}
       </Grid>
 
-      {myApps.length === 0 && (
-        <Flex mt={'35vh'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            还没有应用，快去创建一个吧！
-          </Box>
-        </Flex>
-      )}
+      {myApps.length === 0 && <EmptyTip text={'还没有应用，快去创建一个吧！'} pt={'30vh'} />}
       <ConfirmModal />
       {isOpenCreateModal && (
         <CreateModal onClose={onCloseCreateModal} onSuccess={() => loadMyApps()} />
diff --git a/projects/app/src/pages/chat/components/ChatHeader.tsx b/projects/app/src/pages/chat/components/ChatHeader.tsx
index 3022fa2b9..5975b8dcf 100644
--- a/projects/app/src/pages/chat/components/ChatHeader.tsx
+++ b/projects/app/src/pages/chat/components/ChatHeader.tsx
@@ -8,7 +8,7 @@ import type { ChatItemType } from '@fastgpt/global/core/chat/type';
 import { useRouter } from 'next/router';
 import { useTranslation } from 'next-i18next';
 import { getChatTitleFromChatMessage } from '@fastgpt/global/core/chat/utils';
-import FillTag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 
 const ChatHeader = ({
   history,
@@ -27,7 +27,6 @@ const ChatHeader = ({
   onRoute2AppDetail?: () => void;
   onOpenSlider: () => void;
 }) => {
-  const router = useRouter();
   const theme = useTheme();
   const { t } = useTranslation();
   const { isPc } = useSystemStore();
@@ -44,25 +43,26 @@ const ChatHeader = ({
       h={['46px', '60px']}
       borderBottom={theme.borders.sm}
       color={'myGray.900'}
+      fontSize={'sm'}
     >
       {isPc ? (
         <>
           <Box mr={3} color={'myGray.1000'}>
             {title}
           </Box>
-          <FillTag>
+          <MyTag>
             <MyIcon name={'history'} w={'14px'} />
             <Box ml={1}>
               {history.length === 0
                 ? t('core.chat.New Chat')
                 : t('core.chat.History Amount', { amount: history.length })}
             </Box>
-          </FillTag>
+          </MyTag>
           {!!chatModels && chatModels.length > 0 && (
-            <FillTag ml={2} colorSchema={'green'}>
+            <MyTag ml={2} colorSchema={'green'}>
               <MyIcon name={'core/chat/chatModelTag'} w={'14px'} />
               <Box ml={1}>{chatModels.join(',')}</Box>
-            </FillTag>
+            </MyTag>
           )}
           <Box flex={1} />
         </>
diff --git a/projects/app/src/pages/chat/components/ChatHistorySlider.tsx b/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
index 19478e8de..62846d0c3 100644
--- a/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
+++ b/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
@@ -14,7 +14,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useEditTitle } from '@/web/common/hooks/useEditTitle';
 import { useRouter } from 'next/router';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
@@ -24,6 +24,7 @@ import { AppListItemType } from '@fastgpt/global/core/app/type';
 import { useQuery } from '@tanstack/react-query';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
 import { useI18n } from '@/web/context/I18n';
+import MyMenu from '@fastgpt/web/components/common/MyMenu';
 
 type HistoryItemType = {
   id: string;
@@ -126,6 +127,7 @@ const ChatHistorySlider = ({
             px={[2, 5]}
             alignItems={'center'}
             cursor={canRouteToDetail ? 'pointer' : 'default'}
+            fontSize={'sm'}
             onClick={() =>
               canRouteToDetail &&
               router.replace({
@@ -193,16 +195,17 @@ const ChatHistorySlider = ({
                 position={'relative'}
                 key={item.id || `${i}`}
                 alignItems={'center'}
-                py={3}
+                py={2.5}
                 px={4}
                 cursor={'pointer'}
                 userSelect={'none'}
                 borderRadius={'md'}
                 mb={2}
+                fontSize={'sm'}
                 _hover={{
-                  bg: 'myGray.100',
+                  bg: 'myGray.50',
                   '& .more': {
-                    display: 'block'
+                    visibility: 'visible'
                   }
                 }}
                 bg={item.top ? '#E6F6F6 !important' : ''}
@@ -225,63 +228,63 @@ const ChatHistorySlider = ({
                   {item.customTitle || item.title}
                 </Box>
                 {!!item.id && (
-                  <Box className="more" display={['block', 'none']}>
-                    <Menu autoSelect={false} isLazy offset={[0, 5]}>
-                      <MenuButton
-                        _hover={{ bg: 'white' }}
-                        cursor={'pointer'}
-                        borderRadius={'md'}
-                        onClick={(e) => {
-                          e.stopPropagation();
-                        }}
-                      >
-                        <MyIcon name={'more'} w={'14px'} p={1} />
-                      </MenuButton>
-                      <MenuList color={'myGray.700'} minW={`90px !important`}>
-                        {onSetHistoryTop && (
-                          <MenuItem
-                            onClick={(e) => {
-                              e.stopPropagation();
-                              onSetHistoryTop({ chatId: item.id, top: !item.top });
-                            }}
-                          >
-                            <MyIcon mr={2} name={'core/chat/setTopLight'} w={'16px'}></MyIcon>
-                            {item.top ? t('core.chat.Unpin') : t('core.chat.Pin')}
-                          </MenuItem>
-                        )}
-                        {onSetCustomTitle && (
-                          <MenuItem
-                            onClick={(e) => {
-                              e.stopPropagation();
-                              onOpenModal({
-                                defaultVal: item.customTitle || item.title,
-                                onSuccess: (e) =>
-                                  onSetCustomTitle({
-                                    chatId: item.id,
-                                    title: e
-                                  })
-                              });
-                            }}
-                          >
-                            <MyIcon mr={2} name={'common/customTitleLight'} w={'16px'}></MyIcon>
-                            {t('common.Custom Title')}
-                          </MenuItem>
-                        )}
-                        <MenuItem
-                          _hover={{ color: 'red.500' }}
-                          onClick={(e) => {
-                            e.stopPropagation();
-                            onDelHistory({ chatId: item.id });
-                            if (item.id === activeChatId) {
-                              onChangeChat();
+                  <Box className="more" visibility={['visible', 'hidden']}>
+                    <MyMenu
+                      Button={
+                        <IconButton
+                          size={'xs'}
+                          variant={'whiteBase'}
+                          icon={<MyIcon name={'more'} w={'14px'} p={1} />}
+                          aria-label={''}
+                        />
+                      }
+                      menuList={[
+                        {
+                          children: [
+                            ...(onSetHistoryTop
+                              ? [
+                                  {
+                                    label: item.top ? t('core.chat.Unpin') : t('core.chat.Pin'),
+                                    icon: 'core/chat/setTopLight',
+                                    onClick: () => {
+                                      onSetHistoryTop({ chatId: item.id, top: !item.top });
+                                    }
+                                  }
+                                ]
+                              : []),
+                            ...(onSetCustomTitle
+                              ? [
+                                  {
+                                    label: t('common.Custom Title'),
+                                    icon: 'common/customTitleLight',
+                                    onClick: () => {
+                                      onOpenModal({
+                                        defaultVal: item.customTitle || item.title,
+                                        onSuccess: (e) =>
+                                          onSetCustomTitle({
+                                            chatId: item.id,
+                                            title: e
+                                          })
+                                      });
+                                    }
+                                  }
+                                ]
+                              : []),
+                            {
+                              label: t('common.Delete'),
+                              icon: 'delete',
+                              onClick: () => {
+                                onDelHistory({ chatId: item.id });
+                                if (item.id === activeChatId) {
+                                  onChangeChat();
+                                }
+                              },
+                              type: 'danger'
                             }
-                          }}
-                        >
-                          <MyIcon mr={2} name={'delete'} w={'16px'}></MyIcon>
-                          {t('common.Delete')}
-                        </MenuItem>
-                      </MenuList>
-                    </Menu>
+                          ]
+                        }
+                      ]}
+                    />
                   </Box>
                 )}
               </Flex>
diff --git a/projects/app/src/pages/chat/components/SliderApps.tsx b/projects/app/src/pages/chat/components/SliderApps.tsx
index 91108eb4c..42e21c1bd 100644
--- a/projects/app/src/pages/chat/components/SliderApps.tsx
+++ b/projects/app/src/pages/chat/components/SliderApps.tsx
@@ -55,6 +55,7 @@ const SliderApps = ({
             cursor={'pointer'}
             borderRadius={'md'}
             alignItems={'center'}
+            fontSize={'sm'}
             {...(item._id === activeAppId
               ? {
                   bg: 'white',
diff --git a/projects/app/src/pages/chat/components/ToolMenu.tsx b/projects/app/src/pages/chat/components/ToolMenu.tsx
index 28f968125..414525574 100644
--- a/projects/app/src/pages/chat/components/ToolMenu.tsx
+++ b/projects/app/src/pages/chat/components/ToolMenu.tsx
@@ -55,7 +55,7 @@ const ToolMenu = ({ history }: { history: ChatItemType[] }) => {
           variant={'whitePrimary'}
         />
       }
-      menuList={menuList}
+      menuList={[{ children: menuList }]}
     />
   ) : (
     <Box w={'28px'} h={'28px'} />
diff --git a/projects/app/src/pages/dataset/detail/components/CollectionCard/Header.tsx b/projects/app/src/pages/dataset/detail/components/CollectionCard/Header.tsx
index e085e8055..b0f5a80d6 100644
--- a/projects/app/src/pages/dataset/detail/components/CollectionCard/Header.tsx
+++ b/projects/app/src/pages/dataset/detail/components/CollectionCard/Header.tsx
@@ -122,7 +122,7 @@ const Header = ({}: {}) => {
           }))}
           FirstPathDom={
             <>
-              <Box fontWeight={'bold'} fontSize={['sm', 'lg']}>
+              <Box fontWeight={'bold'} fontSize={['sm', 'md']}>
                 {t(DatasetTypeMap[datasetDetail?.type]?.collectionLabel)}({total})
               </Box>
               {datasetDetail?.websiteConfig?.url && (
@@ -219,54 +219,58 @@ const Header = ({}: {}) => {
               }
               menuList={[
                 {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
-                      {t('Folder')}
-                    </Flex>
-                  ),
-                  onClick: () => setEditFolderData({})
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/manualCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Manual collection')}
-                    </Flex>
-                  ),
-                  onClick: () => {
-                    onOpenCreateVirtualFileModal({
-                      defaultVal: '',
-                      onSuccess: (name) => {
-                        onCreateCollection({ name, type: DatasetCollectionTypeEnum.virtual });
+                  children: [
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
+                          {t('Folder')}
+                        </Flex>
+                      ),
+                      onClick: () => setEditFolderData({})
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/manualCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Manual collection')}
+                        </Flex>
+                      ),
+                      onClick: () => {
+                        onOpenCreateVirtualFileModal({
+                          defaultVal: '',
+                          onSuccess: (name) => {
+                            onCreateCollection({ name, type: DatasetCollectionTypeEnum.virtual });
+                          }
+                        });
                       }
-                    });
-                  }
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Text collection')}
-                    </Flex>
-                  ),
-                  onClick: onOpenFileSourceSelector
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/tableCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Table collection')}
-                    </Flex>
-                  ),
-                  onClick: () =>
-                    router.replace({
-                      query: {
-                        ...router.query,
-                        currentTab: TabEnum.import,
-                        source: ImportDataSourceEnum.csvTable
-                      }
-                    })
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Text collection')}
+                        </Flex>
+                      ),
+                      onClick: onOpenFileSourceSelector
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/tableCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Table collection')}
+                        </Flex>
+                      ),
+                      onClick: () =>
+                        router.replace({
+                          query: {
+                            ...router.query,
+                            currentTab: TabEnum.import,
+                            source: ImportDataSourceEnum.csvTable
+                          }
+                        })
+                    }
+                  ]
                 }
               ]}
             />
@@ -334,29 +338,33 @@ const Header = ({}: {}) => {
               }
               menuList={[
                 {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
-                      {t('Folder')}
-                    </Flex>
-                  ),
-                  onClick: () => setEditFolderData({})
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Text collection')}
-                    </Flex>
-                  ),
-                  onClick: () =>
-                    router.replace({
-                      query: {
-                        ...router.query,
-                        currentTab: TabEnum.import,
-                        source: ImportDataSourceEnum.externalFile
-                      }
-                    })
+                  children: [
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
+                          {t('Folder')}
+                        </Flex>
+                      ),
+                      onClick: () => setEditFolderData({})
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Text collection')}
+                        </Flex>
+                      ),
+                      onClick: () =>
+                        router.replace({
+                          query: {
+                            ...router.query,
+                            currentTab: TabEnum.import,
+                            source: ImportDataSourceEnum.externalFile
+                          }
+                        })
+                    }
+                  ]
                 }
               ]}
             />
diff --git a/projects/app/src/pages/dataset/detail/components/CollectionCard/index.tsx b/projects/app/src/pages/dataset/detail/components/CollectionCard/index.tsx
index cfc694605..5ae06d3ce 100644
--- a/projects/app/src/pages/dataset/detail/components/CollectionCard/index.tsx
+++ b/projects/app/src/pages/dataset/detail/components/CollectionCard/index.tsx
@@ -36,7 +36,7 @@ import dynamic from 'next/dynamic';
 import { useDrag } from '@/web/common/hooks/useDrag';
 import SelectCollections from '@/web/core/dataset/components/SelectCollections';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
 import { DatasetCollectionSyncResultEnum } from '@fastgpt/global/core/dataset/constants';
@@ -186,33 +186,25 @@ const CollectionCard = () => {
           position={'relative'}
           flex={'1 0 0'}
           overflowY={'auto'}
+          fontSize={'sm'}
         >
-          <Table variant={'simple'} fontSize={'sm'} draggable={false}>
+          <Table variant={'simple'} draggable={false}>
             <Thead draggable={false}>
-              <Tr bg={'myGray.100'} mb={2}>
-                <Th borderLeftRadius={'md'} overflow={'hidden'} borderBottom={'none'} py={4}>
-                  #
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('common.Name')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('dataset.collections.Data Amount')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('core.dataset.Sync Time')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('common.Status')}
-                </Th>
-                <Th borderRightRadius={'md'} overflow={'hidden'} borderBottom={'none'} py={4} />
+              <Tr>
+                <Th py={4}>#</Th>
+                <Th py={4}>{t('common.Name')}</Th>
+                <Th py={4}>{t('dataset.collections.Data Amount')}</Th>
+                <Th py={4}>{t('core.dataset.Sync Time')}</Th>
+                <Th py={4}>{t('common.Status')}</Th>
+                <Th py={4} />
               </Tr>
             </Thead>
             <Tbody>
+              <Tr h={'10px'} />
               {formatCollections.map((collection, index) => (
                 <Tr
                   key={collection._id}
-                  _hover={{ bg: 'myWhite.600' }}
+                  _hover={{ bg: 'myGray.50' }}
                   cursor={'pointer'}
                   data-drag-id={
                     collection.type === DatasetCollectionTypeEnum.folder
@@ -271,13 +263,13 @@ const CollectionCard = () => {
                     <Flex alignItems={'center'}>
                       <MyIcon name={collection.icon as any} w={'16px'} mr={2} />
                       <MyTooltip label={t('common.folder.Drag Tip')} shouldWrapChildren={false}>
-                        <Box fontWeight={'bold'} className="textEllipsis">
+                        <Box color={'myGray.900'} className="textEllipsis">
                           {collection.name}
                         </Box>
                       </MyTooltip>
                     </Flex>
                   </Td>
-                  <Td fontSize={'md'}>{collection.dataAmount || '-'}</Td>
+                  <Td>{collection.dataAmount || '-'}</Td>
                   <Td>{dayjs(collection.updateTime).format('YYYY/MM/DD HH:mm')}</Td>
                   <Td>
                     <Box
@@ -333,72 +325,81 @@ const CollectionCard = () => {
                           </MenuButton>
                         }
                         menuList={[
-                          ...(collection.type === DatasetCollectionTypeEnum.link
-                            ? [
-                                {
-                                  label: (
-                                    <Flex alignItems={'center'}>
-                                      <MyIcon name={'common/refreshLight'} w={'14px'} mr={2} />
-                                      {t('core.dataset.collection.Sync')}
-                                    </Flex>
-                                  ),
-                                  onClick: () =>
-                                    openSyncConfirm(() => {
-                                      onclickStartSync(collection._id);
-                                    })()
-                                }
-                              ]
-                            : []),
                           {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
-                                {t('Move')}
-                              </Flex>
-                            ),
-                            onClick: () => setMoveCollectionData({ collectionId: collection._id })
+                            children: [
+                              ...(collection.type === DatasetCollectionTypeEnum.link
+                                ? [
+                                    {
+                                      label: (
+                                        <Flex alignItems={'center'}>
+                                          <MyIcon name={'common/refreshLight'} w={'14px'} mr={2} />
+                                          {t('core.dataset.collection.Sync')}
+                                        </Flex>
+                                      ),
+                                      onClick: () =>
+                                        openSyncConfirm(() => {
+                                          onclickStartSync(collection._id);
+                                        })()
+                                    }
+                                  ]
+                                : []),
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
+                                    {t('Move')}
+                                  </Flex>
+                                ),
+                                onClick: () =>
+                                  setMoveCollectionData({ collectionId: collection._id })
+                              },
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon name={'edit'} w={'14px'} mr={2} />
+                                    {t('Rename')}
+                                  </Flex>
+                                ),
+                                onClick: () =>
+                                  onOpenEditTitleModal({
+                                    defaultVal: collection.name,
+                                    onSuccess: (newName) => {
+                                      onUpdateCollectionName({
+                                        collectionId: collection._id,
+                                        name: newName
+                                      });
+                                    }
+                                  })
+                              }
+                            ]
                           },
                           {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'edit'} w={'14px'} mr={2} />
-                                {t('Rename')}
-                              </Flex>
-                            ),
-                            onClick: () =>
-                              onOpenEditTitleModal({
-                                defaultVal: collection.name,
-                                onSuccess: (newName) => {
-                                  onUpdateCollectionName({
-                                    collectionId: collection._id,
-                                    name: newName
-                                  });
-                                }
-                              })
-                          },
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon
-                                  mr={1}
-                                  name={'delete'}
-                                  w={'14px'}
-                                  _hover={{ color: 'red.600' }}
-                                />
-                                <Box>{t('common.Delete')}</Box>
-                              </Flex>
-                            ),
-                            type: 'danger',
-                            onClick: () =>
-                              openDeleteConfirm(
-                                () => {
-                                  onDelCollection(collection._id);
-                                },
-                                undefined,
-                                collection.type === DatasetCollectionTypeEnum.folder
-                                  ? t('dataset.collections.Confirm to delete the folder')
-                                  : t('dataset.Confirm to delete the file')
-                              )()
+                            children: [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      mr={1}
+                                      name={'delete'}
+                                      w={'14px'}
+                                      _hover={{ color: 'red.600' }}
+                                    />
+                                    <Box>{t('common.Delete')}</Box>
+                                  </Flex>
+                                ),
+                                type: 'danger',
+                                onClick: () =>
+                                  openDeleteConfirm(
+                                    () => {
+                                      onDelCollection(collection._id);
+                                    },
+                                    undefined,
+                                    collection.type === DatasetCollectionTypeEnum.folder
+                                      ? t('dataset.collections.Confirm to delete the folder')
+                                      : t('dataset.Confirm to delete the file')
+                                  )()
+                              }
+                            ]
                           }
                         ]}
                       />
diff --git a/projects/app/src/pages/dataset/detail/components/DataCard.tsx b/projects/app/src/pages/dataset/detail/components/DataCard.tsx
index fae61fd3d..825fcc2f8 100644
--- a/projects/app/src/pages/dataset/detail/components/DataCard.tsx
+++ b/projects/app/src/pages/dataset/detail/components/DataCard.tsx
@@ -42,10 +42,11 @@ import { DatasetCollectionTypeMap, TrainingTypeMap } from '@fastgpt/global/core/
 import { formatTime2YMDHM } from '@fastgpt/global/common/string/time';
 import { formatFileSize } from '@fastgpt/global/common/file/tools';
 import { getCollectionSourceAndOpen } from '@/web/core/dataset/hooks/readCollectionSource';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { getCollectionSourceData } from '@fastgpt/global/core/dataset/collection/utils';
 import { useI18n } from '@/web/context/I18n';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const DataCard = () => {
   const BoxRef = useRef<HTMLDivElement>(null);
@@ -181,7 +182,7 @@ const DataCard = () => {
           : [])
       }
     ];
-  }, [collection, t]);
+  }, [collection, datasetT, t]);
 
   return (
     <Box position={'relative'} py={[1, 5]} h={'100%'}>
@@ -210,7 +211,7 @@ const DataCard = () => {
                 <RawSourceBox
                   collectionId={collection._id}
                   {...getCollectionSourceData(collection)}
-                  fontSize={['md', 'lg']}
+                  fontSize={['sm', 'md']}
                   color={'black'}
                   textDecoration={'none'}
                 />
@@ -252,7 +253,7 @@ const DataCard = () => {
         </Flex>
         <Flex my={3} alignItems={'center'} px={5}>
           <Box>
-            <Box as={'span'} fontSize={['md', 'lg']}>
+            <Box as={'span'} fontSize={['sm', 'md']}>
               {t('core.dataset.data.Total Amount', { total })}
             </Box>
           </Box>
@@ -397,14 +398,7 @@ const DataCard = () => {
               <Pagination />
             </Flex>
           )}
-          {total === 0 && (
-            <Flex flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-              <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-              <Box mt={2} color={'myGray.500'}>
-                {t('core.dataset.data.Empty Tip')}
-              </Box>
-            </Flex>
-          )}
+          {total === 0 && <EmptyTip text={t('core.dataset.data.Empty Tip')}></EmptyTip>}
         </Box>
       </Flex>
 
@@ -412,11 +406,19 @@ const DataCard = () => {
       <Drawer isOpen={isOpen} placement="right" size={'md'} onClose={onClose}>
         <DrawerOverlay />
         <DrawerContent>
-          <DrawerHeader>{t('core.dataset.collection.metadata.metadata')}</DrawerHeader>
+          <DrawerHeader fontSize={'lg'}>
+            {t('core.dataset.collection.metadata.metadata')}
+          </DrawerHeader>
 
           <DrawerBody>
             {metadataList.map((item) => (
-              <Flex key={item.label} alignItems={'center'} mb={5} wordBreak={'break-all'}>
+              <Flex
+                key={item.label}
+                alignItems={'center'}
+                mb={5}
+                wordBreak={'break-all'}
+                fontSize={'sm'}
+              >
                 <Box color={'myGray.500'} flex={'0 0 100px'}>
                   {item.label}
                 </Box>
diff --git a/projects/app/src/pages/dataset/detail/components/Import/commonProgress/DataProcess.tsx b/projects/app/src/pages/dataset/detail/components/Import/commonProgress/DataProcess.tsx
index bfefd2c8c..27f40c7ed 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/commonProgress/DataProcess.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/commonProgress/DataProcess.tsx
@@ -19,15 +19,16 @@ import { useTranslation } from 'next-i18next';
 import LeftRadio from '@fastgpt/web/components/common/Radio/LeftRadio';
 import { TrainingModeEnum, TrainingTypeMap } from '@fastgpt/global/core/dataset/constants';
 import { ImportProcessWayEnum } from '@/web/core/dataset/constants';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { Prompt_AgentQA } from '@fastgpt/global/core/ai/prompt/agent';
 import Preview from '../components/Preview';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetImportContext } from '../Context';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean }) {
   const { t } = useTranslation();
@@ -73,17 +74,15 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
   );
 
   return (
-    <Box h={'100%'} display={['block', 'flex']} gap={5}>
+    <Box h={'100%'} display={['block', 'flex']} gap={5} fontSize={'sm'}>
       <Box flex={'1 0 0'} minW={['auto', '540px']} maxW={'600px'}>
         <Flex alignItems={'center'}>
           <MyIcon name={'common/settingLight'} w={'20px'} />
-          <Box fontSize={'lg'}>{t('core.dataset.import.Data process params')}</Box>
+          <Box fontSize={'md'}>{t('core.dataset.import.Data process params')}</Box>
         </Flex>
 
         <Flex mt={4} alignItems={'center'}>
-          <Box color={'myGray.600'} flex={'0 0 100px'}>
-            {t('core.dataset.import.Training mode')}
-          </Box>
+          <FormLabel flex={'0 0 100px'}>{t('core.dataset.import.Training mode')}</FormLabel>
           <LeftRadio
             list={trainingModeList.map(([key, value]) => ({
               title: t(value.label),
@@ -94,15 +93,14 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
             py={2}
             value={mode}
             onChange={onSelectTrainWay}
-            gridTemplateColumns={'repeat(3,1fr)'}
             defaultBg="white"
             activeBg="white"
+            display={'flex'}
+            flexWrap={'wrap'}
           />
         </Flex>
         <Flex mt={5}>
-          <Box color={'myGray.600'} flex={'0 0 100px'}>
-            {t('core.dataset.import.Process way')}
-          </Box>
+          <FormLabel flex={'0 0 100px'}>{t('core.dataset.import.Process way')}</FormLabel>
           <LeftRadio
             list={[
               {
@@ -269,9 +267,9 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
         <Flex mt={5} alignItems={'center'} pl={'100px'} gap={3}>
           {feConfigs?.show_pay && (
             <MyTooltip label={priceTip}>
-              <Tag colorSchema={'gray'} py={'6px'} borderRadius={'md'} px={3}>
+              <MyTag colorSchema={'gray'} py={'6px'} borderRadius={'md'} px={3}>
                 {priceTip}
-              </Tag>
+              </MyTag>
             </MyTooltip>
           )}
         </Flex>
diff --git a/projects/app/src/pages/dataset/detail/components/Import/commonProgress/Upload.tsx b/projects/app/src/pages/dataset/detail/components/Import/commonProgress/Upload.tsx
index 054e79e19..193a23d12 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/commonProgress/Upload.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/commonProgress/Upload.tsx
@@ -25,7 +25,7 @@ import {
   postCreateDatasetLinkCollection,
   postCreateDatasetTextCollection
 } from '@/web/core/dataset/api';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import { useI18n } from '@/web/context/I18n';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContext';
@@ -173,13 +173,13 @@ const Upload = () => {
                 <Td>
                   <Box display={'inline-block'}>
                     {item.createStatus === 'waiting' && (
-                      <Tag colorSchema={'gray'}>{t('common.Waiting')}</Tag>
+                      <MyTag colorSchema={'gray'}>{t('common.Waiting')}</MyTag>
                     )}
                     {item.createStatus === 'creating' && (
-                      <Tag colorSchema={'blue'}>{t('common.Creating')}</Tag>
+                      <MyTag colorSchema={'blue'}>{t('common.Creating')}</MyTag>
                     )}
                     {item.createStatus === 'finish' && (
-                      <Tag colorSchema={'green'}>{t('common.Finish')}</Tag>
+                      <MyTag colorSchema={'green'}>{t('common.Finish')}</MyTag>
                     )}
                   </Box>
                 </Td>
diff --git a/projects/app/src/pages/dataset/detail/components/Import/components/FileSelector.tsx b/projects/app/src/pages/dataset/detail/components/Import/components/FileSelector.tsx
index 06c21ac53..dade9db7b 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/components/FileSelector.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/components/FileSelector.tsx
@@ -150,7 +150,7 @@ const FileSelector = ({
 
       return onSelectFile(filterFiles);
     },
-    [maxCount, maxSize, onSelectFile, selectFiles.length, t, toast]
+    [fileT, maxCount, maxSize, onSelectFile, selectFiles.length, toast]
   );
 
   const handleDragEnter = (e: DragEvent<HTMLDivElement>) => {
diff --git a/projects/app/src/pages/dataset/detail/components/Import/components/Preview.tsx b/projects/app/src/pages/dataset/detail/components/Import/components/Preview.tsx
index b9f0a0f06..b7decc59d 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/components/Preview.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/components/Preview.tsx
@@ -22,7 +22,7 @@ const Preview = ({ showPreviewChunks }: { showPreviewChunks: boolean }) => {
     <Box h={'100%'} display={['block', 'flex']} flexDirection={'column'}>
       <Flex alignItems={'center'}>
         <MyIcon name={'core/dataset/fileCollection'} w={'20px'} />
-        <Box fontSize={'lg'}>{t('core.dataset.import.Sources list')}</Box>
+        <Box fontSize={'md'}>{t('core.dataset.import.Sources list')}</Box>
       </Flex>
       <Box mt={3} flex={'1 0 0'} width={'100%'} overflow={'auto'}>
         {sources.map((source) => (
@@ -54,22 +54,26 @@ const Preview = ({ showPreviewChunks }: { showPreviewChunks: boolean }) => {
                   }
                   menuList={[
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'core/dataset/fileCollection'} w={'14px'} mr={2} />
-                          {t('core.dataset.import.Preview raw text')}
-                        </Flex>
-                      ),
-                      onClick: () => setPreviewRawTextSource(source)
-                    },
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'core/dataset/splitLight'} w={'14px'} mr={2} />
-                          {t('core.dataset.import.Preview chunks')}
-                        </Flex>
-                      ),
-                      onClick: () => setPreviewChunkSource(source)
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'core/dataset/fileCollection'} w={'14px'} mr={2} />
+                              {t('core.dataset.import.Preview raw text')}
+                            </Flex>
+                          ),
+                          onClick: () => setPreviewRawTextSource(source)
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'core/dataset/splitLight'} w={'14px'} mr={2} />
+                              {t('core.dataset.import.Preview chunks')}
+                            </Flex>
+                          ),
+                          onClick: () => setPreviewChunkSource(source)
+                        }
+                      ]
                     }
                   ]}
                 />
diff --git a/projects/app/src/pages/dataset/detail/components/Import/components/PreviewChunks.tsx b/projects/app/src/pages/dataset/detail/components/Import/components/PreviewChunks.tsx
index 2360d2f32..c909e401b 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/components/PreviewChunks.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/components/PreviewChunks.tsx
@@ -82,27 +82,30 @@ const PreviewChunks = ({
       title={previewSource.sourceName}
       isLoading={isLoading}
       maxW={['90vw', '40vw']}
+      px={0}
     >
-      {data.map((item, index) => (
-        <Box
-          key={index}
-          whiteSpace={'pre-wrap'}
-          fontSize={'sm'}
-          p={4}
-          bg={index % 2 === 0 ? 'white' : 'myWhite.600'}
-          mb={3}
-          borderRadius={'md'}
-          borderWidth={'1px'}
-          borderColor={'borderColor.low'}
-          boxShadow={'2'}
-          _notLast={{
-            mb: 2
-          }}
-        >
-          <Box color={'myGray.900'}>{item.q}</Box>
-          <Box color={'myGray.500'}>{item.a}</Box>
-        </Box>
-      ))}
+      <Box overflowY={'auto'} px={5} fontSize={'sm'}>
+        {data.map((item, index) => (
+          <Box
+            key={index}
+            whiteSpace={'pre-wrap'}
+            fontSize={'sm'}
+            p={4}
+            bg={index % 2 === 0 ? 'white' : 'myWhite.600'}
+            mb={3}
+            borderRadius={'md'}
+            borderWidth={'1px'}
+            borderColor={'borderColor.low'}
+            boxShadow={'2'}
+            _notLast={{
+              mb: 2
+            }}
+          >
+            <Box color={'myGray.900'}>{item.q}</Box>
+            <Box color={'myGray.500'}>{item.a}</Box>
+          </Box>
+        ))}
+      </Box>
     </MyRightDrawer>
   );
 };
diff --git a/projects/app/src/pages/dataset/detail/components/Import/components/PreviewRawText.tsx b/projects/app/src/pages/dataset/detail/components/Import/components/PreviewRawText.tsx
index b43855e11..20233925c 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/components/PreviewRawText.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/components/PreviewRawText.tsx
@@ -63,8 +63,9 @@ const PreviewRawText = ({
       iconSrc={previewSource.icon}
       title={previewSource.sourceName}
       isLoading={isLoading}
+      px={0}
     >
-      <Box whiteSpace={'pre-wrap'} overflowY={'auto'} fontSize={'sm'}>
+      <Box whiteSpace={'pre-wrap'} overflowY={'auto'} px={5} fontSize={'sm'}>
         {rawText}
       </Box>
     </MyRightDrawer>
diff --git a/projects/app/src/pages/dataset/detail/components/Import/components/RenderFiles.tsx b/projects/app/src/pages/dataset/detail/components/Import/components/RenderFiles.tsx
index 940607d01..8c7c47a1b 100644
--- a/projects/app/src/pages/dataset/detail/components/Import/components/RenderFiles.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/components/RenderFiles.tsx
@@ -14,7 +14,7 @@ import {
 import { ImportSourceItemType } from '@/web/core/dataset/type.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import dynamic from 'next/dynamic';
 import { useI18n } from '@/web/context/I18n';
 
diff --git a/projects/app/src/pages/dataset/detail/components/Info.tsx b/projects/app/src/pages/dataset/detail/components/Info.tsx
index 2bd1b3634..8fd1c1217 100644
--- a/projects/app/src/pages/dataset/detail/components/Info.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Info.tsx
@@ -9,7 +9,7 @@ import { useForm } from 'react-hook-form';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
 import type { DatasetItemType } from '@fastgpt/global/core/dataset/type.d';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import PermissionRadio from '@/components/support/permission/Radio';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
@@ -24,6 +24,7 @@ import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContex
 import MyDivider from '@fastgpt/web/components/common/MyDivider/index';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const Info = ({ datasetId }: { datasetId: string }) => {
   const { t } = useTranslation();
@@ -126,15 +127,15 @@ const Info = ({ datasetId }: { datasetId: string }) => {
   return (
     <Box py={5} px={[5, 10]}>
       <Flex mt={5} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Dataset ID')}
-        </Box>
+        </FormLabel>
         <Box flex={1}>{datasetDetail._id}</Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'} flexWrap={'wrap'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.ai.model.Vector Model')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <AIModelSelector
             w={'100%'}
@@ -160,15 +161,15 @@ const Info = ({ datasetId }: { datasetId: string }) => {
         </Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.Max Token')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>{vectorModel.maxToken}</Box>
       </Flex>
       <Flex mt={6} alignItems={'center'} flexWrap={'wrap'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.ai.model.Dataset Agent Model')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <AIModelSelector
             w={'100%'}
@@ -206,9 +207,9 @@ const Info = ({ datasetId }: { datasetId: string }) => {
       )}
 
       <Flex mt={5} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Avatar')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <MyTooltip label={t('common.avatar.Select Avatar')}>
             <Avatar
@@ -223,22 +224,20 @@ const Info = ({ datasetId }: { datasetId: string }) => {
         </Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Name')}
-        </Box>
+        </FormLabel>
         <Input flex={[1, '0 0 320px']} maxLength={30} {...register('name')} />
       </Flex>
       <Flex mt={8} alignItems={'center'} w={'100%'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']}>
-          {t('common.Intro')}
-        </Box>
+        <FormLabel flex={['0 0 90px', '0 0 160px']}>{t('common.Intro')}</FormLabel>
         <Textarea flex={[1, '0 0 320px']} {...register('intro')} placeholder={t('common.Intro')} />
       </Flex>
       {datasetDetail.isOwner && (
         <Flex mt={5} alignItems={'center'} w={'100%'} flexWrap={'wrap'}>
-          <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+          <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
             {t('user.Permission')}
-          </Box>
+          </FormLabel>
           <Box>
             <PermissionRadio
               value={permission}
@@ -251,7 +250,7 @@ const Info = ({ datasetId }: { datasetId: string }) => {
       )}
 
       <Flex mt={5} w={'100%'} alignItems={'flex-end'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}></Box>
+        <Box flex={['0 0 90px', '0 0 160px']} w={0}></Box>
         <Button
           isLoading={btnLoading}
           mr={4}
diff --git a/projects/app/src/pages/dataset/detail/components/InputDataModal.tsx b/projects/app/src/pages/dataset/detail/components/InputDataModal.tsx
index 12dfa6ef1..b1adeffeb 100644
--- a/projects/app/src/pages/dataset/detail/components/InputDataModal.tsx
+++ b/projects/app/src/pages/dataset/detail/components/InputDataModal.tsx
@@ -11,7 +11,7 @@ import {
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useQuery } from '@tanstack/react-query';
 import { useTranslation } from 'next-i18next';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
@@ -258,7 +258,7 @@ const InputDataModal = ({
           />
         </Box>
         <Flex flexDirection={'column'} pb={8} flex={1} h={'100%'}>
-          <Box fontSize={'lg'} px={5} py={3} fontWeight={'medium'}>
+          <Box fontSize={'md'} px={5} py={3} fontWeight={'medium'}>
             {currentTab === TabEnum.content && (
               <>{dataId ? t('dataset.data.Update Data') : t('dataset.data.Input Data')}</>
             )}
@@ -311,7 +311,6 @@ const InputDataModal = ({
                     ) : (
                       <Textarea
                         maxLength={maxToken}
-                        fontSize={'sm'}
                         rows={10}
                         borderColor={'transparent'}
                         px={0}
diff --git a/projects/app/src/pages/dataset/detail/components/Slider.tsx b/projects/app/src/pages/dataset/detail/components/Slider.tsx
index 023ab5432..2158aba53 100644
--- a/projects/app/src/pages/dataset/detail/components/Slider.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Slider.tsx
@@ -135,11 +135,12 @@ const Slider = ({ currentTab }: { currentTab: TabEnum }) => {
             px={3}
             borderRadius={'md'}
             _hover={{ bg: 'myGray.100' }}
+            fontSize={'sm'}
             onClick={() => router.replace('/dataset/list')}
           >
             <IconButton
               mr={3}
-              icon={<MyIcon name={'common/backFill'} w={'18px'} color={'primary.500'} />}
+              icon={<MyIcon name={'common/backFill'} w={'1rem'} color={'primary.500'} />}
               bg={'white'}
               boxShadow={'1px 1px 9px rgba(0,0,0,0.15)'}
               size={'smSquare'}
diff --git a/projects/app/src/pages/dataset/detail/components/Test.tsx b/projects/app/src/pages/dataset/detail/components/Test.tsx
index 29b9b98db..00b0e442c 100644
--- a/projects/app/src/pages/dataset/detail/components/Test.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Test.tsx
@@ -9,8 +9,7 @@ import { formatTimeToChatTime } from '@fastgpt/global/common/string/time';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { customAlphabet } from 'nanoid';
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { SearchTestResponse } from '@/global/core/dataset/api';
 import {
@@ -27,6 +26,8 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import SearchParamsTip from '@/components/core/dataset/SearchParamsTip';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContext';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 12);
 
@@ -321,7 +322,6 @@ const TestHistories = React.memo(function TestHistories({
   setDatasetTestItem: React.Dispatch<React.SetStateAction<SearchTestStoreItemType | undefined>>;
 }) {
   const { t } = useTranslation();
-  const theme = useTheme();
   const { datasetTestList, delDatasetTestItemById } = useSearchTestStore();
 
   const testHistories = useMemo(
@@ -332,7 +332,7 @@ const TestHistories = React.memo(function TestHistories({
     <>
       <Flex alignItems={'center'} color={'myGray.900'}>
         <MyIcon mr={2} name={'history'} w={'18px'} h={'18px'} color={'myGray.900'} />
-        <Box fontSize={'xl'}>{t('core.dataset.test.test history')}</Box>
+        <Box fontSize={'md'}>{t('core.dataset.test.test history')}</Box>
       </Flex>
       <Box mt={2}>
         {testHistories.map((item) => (
@@ -417,21 +417,10 @@ const TestResults = React.memo(function TestResults({
   return (
     <>
       {!datasetTestItem?.results || datasetTestItem.results.length === 0 ? (
-        <Flex
-          mt={[10, 0]}
-          h={'100%'}
-          flexDirection={'column'}
-          alignItems={'center'}
-          justifyContent={'center'}
-        >
-          <MyIcon name={'empty'} color={'transparent'} w={'54px'} />
-          <Box mt={3} color={'myGray.600'}>
-            {t('core.dataset.test.test result placeholder')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.dataset.test.test result placeholder')} mt={[10, '20vh']} />
       ) : (
         <>
-          <Flex fontSize={'xl'} color={'myGray.900'} alignItems={'center'}>
+          <Flex fontSize={'md'} color={'myGray.900'} alignItems={'center'}>
             <MyIcon name={'common/paramsLight'} w={'18px'} mr={2} />
             {t('core.dataset.test.Test params')}
           </Flex>
@@ -446,14 +435,12 @@ const TestResults = React.memo(function TestResults({
           </Box>
 
           <Flex mt={5} mb={3} alignItems={'center'}>
-            <Flex fontSize={'xl'} color={'myGray.900'} alignItems={'center'}>
+            <Flex fontSize={'md'} color={'myGray.900'} alignItems={'center'}>
               <MyIcon name={'common/resultLight'} w={'18px'} mr={2} />
               {t('core.dataset.test.Test Result')}
             </Flex>
-            <MyTooltip label={t('core.dataset.test.test result tip')} forceShow>
-              <QuestionOutlineIcon mx={2} color={'myGray.600'} cursor={'pointer'} fontSize={'lg'} />
-            </MyTooltip>
-            <Box>({datasetTestItem.duration})</Box>
+            <QuestionTip ml={1} label={t('core.dataset.test.test result tip')} />
+            <Box ml={2}>({datasetTestItem.duration})</Box>
           </Flex>
           <Box mt={1} gap={4}>
             {datasetTestItem?.results.map((item, index) => (
diff --git a/projects/app/src/pages/dataset/list/component/CreateModal.tsx b/projects/app/src/pages/dataset/list/component/CreateModal.tsx
index 4cb46ae79..e6dd26210 100644
--- a/projects/app/src/pages/dataset/list/component/CreateModal.tsx
+++ b/projects/app/src/pages/dataset/list/component/CreateModal.tsx
@@ -9,7 +9,7 @@ import { useRouter } from 'next/router';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { postCreateDataset } from '@/web/core/dataset/api';
 import type { CreateDatasetParams } from '@/global/core/dataset/api.d';
@@ -17,9 +17,9 @@ import { useTranslation } from 'next-i18next';
 import MyRadio from '@/components/common/MyRadio';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import AIModelSelector from '@/components/Select/AIModelSelector';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: string }) => {
   const { t } = useTranslation();
@@ -111,9 +111,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
       isCentered={!isPc}
       w={'450px'}
     >
-      <ModalBody>
+      <ModalBody py={2}>
         <>
-          <Box mb={1} color={'myGray.800'} fontWeight={'bold'}>
+          <Box mb={1} color={'myGray.900'}>
             {t('core.dataset.Dataset Type')}
           </Box>
           <MyRadio
@@ -144,9 +144,7 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
           />
         </>
         <Box mt={5}>
-          <Box color={'myGray.800'} fontWeight={'bold'}>
-            {t('common.Set Name')}
-          </Box>
+          <Box color={'myGray.900'}>{t('common.Set Name')}</Box>
           <Flex mt={1} alignItems={'center'}>
             <MyTooltip label={t('common.avatar.Select Avatar')}>
               <Avatar
@@ -174,11 +172,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
         </Box>
         {filterNotHiddenVectorModelList.length > 1 && (
           <Flex mt={6} alignItems={'center'}>
-            <Flex alignItems={'center'} flex={'0 0 100px'}>
+            <Flex alignItems={'center'} flex={'0 0 100px'} fontSize={'sm'}>
               {t('core.ai.model.Vector Model')}
-              <MyTooltip label={t('core.dataset.embedding model tip')}>
-                <QuestionOutlineIcon ml={1} />
-              </MyTooltip>
+              <QuestionTip label={t('core.dataset.embedding model tip')} />
             </Flex>
             <Box flex={1}>
               <AIModelSelector
@@ -197,7 +193,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
         )}
         {datasetModelList.length > 1 && (
           <Flex mt={6} alignItems={'center'}>
-            <Box flex={'0 0 100px'}>{t('core.ai.model.Dataset Agent Model')}</Box>
+            <Box flex={'0 0 100px'} fontSize={'sm'}>
+              {t('core.ai.model.Dataset Agent Model')}
+            </Box>
             <Box flex={1}>
               <AIModelSelector
                 w={'100%'}
diff --git a/projects/app/src/pages/dataset/list/component/MoveModal.tsx b/projects/app/src/pages/dataset/list/component/MoveModal.tsx
index a6b7531d3..8ba34e7aa 100644
--- a/projects/app/src/pages/dataset/list/component/MoveModal.tsx
+++ b/projects/app/src/pages/dataset/list/component/MoveModal.tsx
@@ -11,7 +11,7 @@ import {
   Grid
 } from '@chakra-ui/react';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
@@ -19,6 +19,7 @@ import { useTranslation } from 'next-i18next';
 import { useQuery } from '@tanstack/react-query';
 import { getDatasets, putDatasetById, getDatasetPaths } from '@/web/core/dataset/api';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const MoveModal = ({
   onClose,
@@ -70,7 +71,7 @@ const MoveModal = ({
       title={
         <>
           {!!parentId ? (
-            <Flex flex={1} userSelect={'none'} fontSize={['sm', 'lg']} fontWeight={'normal'}>
+            <Flex flex={1} userSelect={'none'} fontSize={['sm', 'md']} fontWeight={'normal'}>
               {paths.map((item, i) => (
                 <Flex key={item.parentId} mr={2} alignItems={'center'}>
                   <Box
@@ -146,7 +147,7 @@ const MoveModal = ({
                           className="textEllipsis"
                           ml={3}
                           fontWeight={'bold'}
-                          fontSize={['md', 'lg', 'xl']}
+                          fontSize={['md', 'md']}
                         >
                           {item.name}
                         </Box>
@@ -167,14 +168,7 @@ const MoveModal = ({
               })()
             )}
           </Grid>
-          {folderList.length === 0 && (
-            <Flex mt={5} flexDirection={'column'} alignItems={'center'}>
-              <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-              <Box mt={2} color={'myGray.500'}>
-                {t('common.folder.No Folder')}
-              </Box>
-            </Flex>
-          )}
+          {folderList.length === 0 && <EmptyTip text={t('common.folder.No Folder')}></EmptyTip>}
         </ModalBody>
 
         <ModalFooter>
diff --git a/projects/app/src/pages/dataset/list/index.tsx b/projects/app/src/pages/dataset/list/index.tsx
index 5e86f4cf9..ab7ee695e 100644
--- a/projects/app/src/pages/dataset/list/index.tsx
+++ b/projects/app/src/pages/dataset/list/index.tsx
@@ -35,6 +35,7 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import { downloadFetch } from '@/web/common/system/utils';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const CreateModal = dynamic(() => import('./component/CreateModal'), { ssr: false });
 const MoveModal = dynamic(() => import('./component/MoveModal'), { ssr: false });
@@ -182,22 +183,26 @@ const Dataset = () => {
             }
             menuList={[
               {
-                label: (
-                  <Flex>
-                    <MyIcon name={FolderIcon} w={'20px'} mr={1} />
-                    {t('Folder')}
-                  </Flex>
-                ),
-                onClick: () => setEditFolderData({})
-              },
-              {
-                label: (
-                  <Flex>
-                    <Image src={'/imgs/workflow/db.png'} alt={''} w={'20px'} mr={1} />
-                    {t('core.dataset.Dataset')}
-                  </Flex>
-                ),
-                onClick: onOpenCreateModal
+                children: [
+                  {
+                    label: (
+                      <Flex>
+                        <MyIcon name={FolderIcon} w={'20px'} mr={1} />
+                        {t('Folder')}
+                      </Flex>
+                    ),
+                    onClick: () => setEditFolderData({})
+                  },
+                  {
+                    label: (
+                      <Flex>
+                        <Image src={'/imgs/workflow/db.png'} alt={''} w={'20px'} mr={1} />
+                        {t('core.dataset.Dataset')}
+                      </Flex>
+                    ),
+                    onClick: onOpenCreateModal
+                  }
+                ]
               }
             ]}
           />
@@ -310,96 +315,108 @@ const Dataset = () => {
                   }
                   menuList={[
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'edit'} w={'14px'} mr={2} />
-                          {t('Rename')}
-                        </Flex>
-                      ),
-                      onClick: () =>
-                        onOpenTitleModal({
-                          defaultVal: dataset.name,
-                          onSuccess: (val) => {
-                            if (val === dataset.name || !val) return;
-                            putDatasetById({
-                              id: dataset._id,
-                              name: val
-                            });
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'edit'} w={'14px'} mr={2} />
+                              {t('Rename')}
+                            </Flex>
+                          ),
+                          onClick: () =>
+                            onOpenTitleModal({
+                              defaultVal: dataset.name,
+                              onSuccess: (val) => {
+                                if (val === dataset.name || !val) return;
+                                putDatasetById({
+                                  id: dataset._id,
+                                  name: val
+                                });
+                              }
+                            })
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
+                              {t('Move')}
+                            </Flex>
+                          ),
+                          onClick: () => setMoveDataId(dataset._id)
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'export'} w={'14px'} mr={2} />
+                              {t('Export')}
+                            </Flex>
+                          ),
+                          onClick: () => {
+                            exportDataset(dataset);
                           }
-                        })
+                        },
+                        ...(dataset.permission === PermissionTypeEnum.private
+                          ? [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      name={'support/permission/publicLight'}
+                                      w={'14px'}
+                                      mr={2}
+                                    />
+                                    {t('permission.Set Public')}
+                                  </Flex>
+                                ),
+                                onClick: () => {
+                                  putDatasetById({
+                                    id: dataset._id,
+                                    permission: PermissionTypeEnum.public
+                                  });
+                                }
+                              }
+                            ]
+                          : [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      name={'support/permission/privateLight'}
+                                      w={'14px'}
+                                      mr={2}
+                                    />
+                                    {t('permission.Set Private')}
+                                  </Flex>
+                                ),
+                                onClick: () => {
+                                  putDatasetById({
+                                    id: dataset._id,
+                                    permission: PermissionTypeEnum.private
+                                  });
+                                }
+                              }
+                            ])
+                      ]
                     },
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
-                          {t('Move')}
-                        </Flex>
-                      ),
-                      onClick: () => setMoveDataId(dataset._id)
-                    },
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'export'} w={'14px'} mr={2} />
-                          {t('Export')}
-                        </Flex>
-                      ),
-                      onClick: () => {
-                        exportDataset(dataset);
-                      }
-                    },
-                    ...(dataset.permission === PermissionTypeEnum.private
-                      ? [
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'support/permission/publicLight'} w={'14px'} mr={2} />
-                                {t('permission.Set Public')}
-                              </Flex>
-                            ),
-                            onClick: () => {
-                              putDatasetById({
-                                id: dataset._id,
-                                permission: PermissionTypeEnum.public
-                              });
-                            }
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'delete'} w={'14px'} mr={2} />
+                              {t('common.Delete')}
+                            </Flex>
+                          ),
+                          type: 'danger',
+                          onClick: () => {
+                            openConfirm(
+                              () => onclickDelDataset(dataset._id),
+                              undefined,
+                              DeleteTipsMap.current[dataset.type]
+                            )();
                           }
-                        ]
-                      : [
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon
-                                  name={'support/permission/privateLight'}
-                                  w={'14px'}
-                                  mr={2}
-                                />
-                                {t('permission.Set Private')}
-                              </Flex>
-                            ),
-                            onClick: () => {
-                              putDatasetById({
-                                id: dataset._id,
-                                permission: PermissionTypeEnum.private
-                              });
-                            }
-                          }
-                        ]),
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'delete'} w={'14px'} mr={2} />
-                          {t('common.Delete')}
-                        </Flex>
-                      ),
-                      type: 'danger',
-                      onClick: () => {
-                        openConfirm(
-                          () => onclickDelDataset(dataset._id),
-                          undefined,
-                          DeleteTipsMap.current[dataset.type]
-                        )();
-                      }
+                        }
+                      ]
                     }
                   ]}
                 />
@@ -416,7 +433,7 @@ const Dataset = () => {
               className={'textEllipsis3'}
               py={1}
               wordBreak={'break-all'}
-              fontSize={'sm'}
+              fontSize={'xs'}
               color={'myGray.500'}
             >
               {dataset.intro ||
@@ -436,12 +453,7 @@ const Dataset = () => {
         ))}
       </Grid>
       {myDatasets.length === 0 && (
-        <Flex mt={'35vh'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.dataset.Empty Dataset Tips')}
-          </Box>
-        </Flex>
+        <EmptyTip pt={'35vh'} text={t('core.dataset.Empty Dataset Tips')}></EmptyTip>
       )}
       <ConfirmModal />
       <EditTitleModal />
diff --git a/projects/app/src/pages/login/components/ForgetPasswordForm.tsx b/projects/app/src/pages/login/components/ForgetPasswordForm.tsx
index 3f73c9cf0..1ac9ea7e0 100644
--- a/projects/app/src/pages/login/components/ForgetPasswordForm.tsx
+++ b/projects/app/src/pages/login/components/ForgetPasswordForm.tsx
@@ -166,7 +166,7 @@ const RegisterForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           mt={10}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickFindPassword)}
diff --git a/projects/app/src/pages/login/components/LoginForm/LoginForm.tsx b/projects/app/src/pages/login/components/LoginForm/LoginForm.tsx
index 5e8f49f6b..1e0d482f8 100644
--- a/projects/app/src/pages/login/components/LoginForm/LoginForm.tsx
+++ b/projects/app/src/pages/login/components/LoginForm/LoginForm.tsx
@@ -132,7 +132,7 @@ const LoginForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           my={6}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickLogin)}
diff --git a/projects/app/src/pages/login/components/RegisterForm.tsx b/projects/app/src/pages/login/components/RegisterForm.tsx
index b98caa0e0..a3817824f 100644
--- a/projects/app/src/pages/login/components/RegisterForm.tsx
+++ b/projects/app/src/pages/login/components/RegisterForm.tsx
@@ -181,7 +181,7 @@ const RegisterForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           mt={6}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickRegister)}
diff --git a/projects/app/src/pages/plugin/edit/Header.tsx b/projects/app/src/pages/plugin/edit/Header.tsx
index cd0ef3ac3..356840646 100644
--- a/projects/app/src/pages/plugin/edit/Header.tsx
+++ b/projects/app/src/pages/plugin/edit/Header.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'next-i18next';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
 import dynamic from 'next/dynamic';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { uiWorkflow2StoreWorkflow } from '@/components/core/workflow/utils';
 import { putUpdatePlugin } from '@/web/core/plugin/api';
 import { useToast } from '@fastgpt/web/hooks/useToast';
@@ -106,7 +106,7 @@ const Header = ({ plugin, onClose }: Props) => {
               }}
             />
           </MyTooltip>
-          <Box ml={[3, 5]} fontSize={['md', '2xl']} flex={1}>
+          <Box ml={[3, 5]} fontSize={['md', 'lg']} flex={1}>
             {plugin.name}
           </Box>
 
@@ -121,11 +121,19 @@ const Header = ({ plugin, onClose }: Props) => {
               />
             }
             menuList={[
-              { label: appT('Import Configs'), icon: 'common/importLight', onClick: onOpenImport },
               {
-                label: appT('Export Configs'),
-                icon: 'export',
-                onClick: onExportWorkflow
+                children: [
+                  {
+                    label: appT('Import Configs'),
+                    icon: 'common/importLight',
+                    onClick: onOpenImport
+                  },
+                  {
+                    label: appT('Export Configs'),
+                    icon: 'export',
+                    onClick: onExportWorkflow
+                  }
+                ]
               }
             ]}
           />
diff --git a/projects/app/src/pages/plugin/list/component/EditModal.tsx b/projects/app/src/pages/plugin/list/component/EditModal.tsx
index a53e6cc5f..2b7e77269 100644
--- a/projects/app/src/pages/plugin/list/component/EditModal.tsx
+++ b/projects/app/src/pages/plugin/list/component/EditModal.tsx
@@ -10,7 +10,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import { delOnePlugin, postCreatePlugin, putUpdatePlugin } from '@/web/core/plugin/api';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
diff --git a/projects/app/src/pages/plugin/list/component/HttpPluginEditModal.tsx b/projects/app/src/pages/plugin/list/component/HttpPluginEditModal.tsx
index 49bbef951..288210912 100644
--- a/projects/app/src/pages/plugin/list/component/HttpPluginEditModal.tsx
+++ b/projects/app/src/pages/plugin/list/component/HttpPluginEditModal.tsx
@@ -22,7 +22,7 @@ import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { CreateOnePluginParams } from '@fastgpt/global/core/plugin/controller';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
@@ -300,13 +300,23 @@ const HttpPluginEditModal = ({
             <Box color={'myGray.800'} fontWeight={'bold'} mt={3}>
               {t('core.plugin.Custom headers')}
             </Box>
-            <Box mt={1}>
+            <Box
+              mt={1}
+              borderRadius={'md'}
+              overflow={'hidden'}
+              borderWidth={'1px'}
+              borderBottom={'none'}
+            >
               <TableContainer overflowY={'visible'} overflowX={'unset'}>
                 <Table>
                   <Thead>
                     <Tr>
-                      <Th px={2}>{t('core.module.http.Props name')}</Th>
-                      <Th px={2}>{t('core.module.http.Props value')}</Th>
+                      <Th px={2} borderRadius="none !important">
+                        {t('core.module.http.Props name')}
+                      </Th>
+                      <Th px={2} borderRadius="none !important">
+                        {t('core.module.http.Props value')}
+                      </Th>
                     </Tr>
                   </Thead>
                   <Tbody>
@@ -464,7 +474,7 @@ const HttpPluginEditModal = ({
               borderRadius={'md'}
               overflow={'hidden'}
               borderWidth={'1px'}
-              borderBottom="none"
+              borderBottom={'none'}
             >
               <TableContainer maxH={400} overflowY={'auto'}>
                 <Table bg={'white'}>
diff --git a/projects/app/src/pages/plugin/list/index.tsx b/projects/app/src/pages/plugin/list/index.tsx
index 579f73113..f54b25278 100644
--- a/projects/app/src/pages/plugin/list/index.tsx
+++ b/projects/app/src/pages/plugin/list/index.tsx
@@ -89,22 +89,32 @@ const TeamPlugins = () => {
             }
             menuList={[
               {
-                label: (
-                  <Flex>
-                    <Image src={'/imgs/workflow/plugin.svg'} alt={''} w={'18px'} mr={1} />
-                    {t('plugin.Custom Plugin')}
-                  </Flex>
-                ),
-                onClick: () => setEditModalData(defaultForm)
-              },
-              {
-                label: (
-                  <Flex display={'flex'} alignItems={'center'}>
-                    <Image src={'/imgs/workflow/http.png'} alt={''} w={'18px'} h={'14px'} mr={1} />
-                    {t('plugin.HTTP Plugin')}
-                  </Flex>
-                ),
-                onClick: () => setHttpPluginModalData(defaultHttpPlugin)
+                children: [
+                  {
+                    label: (
+                      <Flex>
+                        <Image src={'/imgs/workflow/plugin.svg'} alt={''} w={'18px'} mr={1} />
+                        {t('plugin.Custom Plugin')}
+                      </Flex>
+                    ),
+                    onClick: () => setEditModalData(defaultForm)
+                  },
+                  {
+                    label: (
+                      <Flex display={'flex'} alignItems={'center'}>
+                        <Image
+                          src={'/imgs/workflow/http.png'}
+                          alt={''}
+                          w={'18px'}
+                          h={'14px'}
+                          mr={1}
+                        />
+                        {t('plugin.HTTP Plugin')}
+                      </Flex>
+                    ),
+                    onClick: () => setHttpPluginModalData(defaultHttpPlugin)
+                  }
+                ]
               }
             ]}
           />
diff --git a/projects/app/src/pages/price/components/ExtraPlan.tsx b/projects/app/src/pages/price/components/ExtraPlan.tsx
index 63ff5f368..5577c8458 100644
--- a/projects/app/src/pages/price/components/ExtraPlan.tsx
+++ b/projects/app/src/pages/price/components/ExtraPlan.tsx
@@ -127,7 +127,7 @@ const ExtraPlan = () => {
       <Box id={'extra-plan'} fontWeight={'bold'} fontSize={['24px', '36px']}>
         {t('support.wallet.subscription.Extra plan')}
       </Box>
-      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'lg'}>
+      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'md'}>
         {t('support.wallet.subscription.Extra plan tip')}
       </Box>
       <Grid mt={8} gridTemplateColumns={['1fr', '1fr 1fr']} gap={5} w={['100%', 'auto']}>
@@ -143,12 +143,12 @@ const ExtraPlan = () => {
         >
           <Flex borderBottomWidth={'1px'} borderBottomColor={'myGray.200'}>
             <Box flex={'1 0 0'}>
-              <Box fontSize={'xl'} color={'primary.600'}>
+              <Box fontSize={'lg'} color={'primary.600'}>
                 {t('support.wallet.subscription.Extra dataset size')}
               </Box>
               <Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
                 ￥{extraDatasetPrice}/1000组{' '}
-                <Box ml={1} as={'span'} fontSize={'lg'} color={'myGray.600'} fontWeight={'normal'}>
+                <Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
                   /{t('common.month')}
                 </Box>
               </Box>
@@ -248,12 +248,12 @@ const ExtraPlan = () => {
         >
           <Flex borderBottomWidth={'1px'} borderBottomColor={'myGray.200'}>
             <Box flex={'1 0 0'}>
-              <Box fontSize={'xl'} color={'primary.600'}>
+              <Box fontSize={'lg'} color={'primary.600'}>
                 {t('support.wallet.subscription.Extra ai points')}
               </Box>
               <Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
                 ￥{extraPointsPrice}/1000积分{' '}
-                <Box ml={1} as={'span'} fontSize={'lg'} color={'myGray.600'} fontWeight={'normal'}>
+                <Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
                   /{t('common.month')}
                 </Box>
               </Box>
diff --git a/projects/app/src/pages/price/components/Points.tsx b/projects/app/src/pages/price/components/Points.tsx
index 110e5ace7..f094c21d8 100644
--- a/projects/app/src/pages/price/components/Points.tsx
+++ b/projects/app/src/pages/price/components/Points.tsx
@@ -36,7 +36,7 @@ const Points = () => {
             borderRightColor={'myGray.150'}
             py={4}
             px={6}
-            fontSize={'lg'}
+            fontSize={'md'}
             fontWeight={'bold'}
           >
             AI语言模型
@@ -59,7 +59,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               索引模型
             </Box>
             <Box fontSize={'sm'} mt={1} color={'myGray.500'}>
@@ -84,7 +84,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               语音播放
             </Box>
           </Box>
@@ -106,7 +106,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               语音输入
             </Box>
           </Box>
diff --git a/projects/app/src/pages/price/components/Standard.tsx b/projects/app/src/pages/price/components/Standard.tsx
index 89b0d6fb1..528e595cd 100644
--- a/projects/app/src/pages/price/components/Standard.tsx
+++ b/projects/app/src/pages/price/components/Standard.tsx
@@ -100,7 +100,7 @@ const Standard = ({
       <Box fontWeight={'bold'} fontSize={['24px', '36px']}>
         {t('support.wallet.subscription.Sub plan')}
       </Box>
-      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'lg'}>
+      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'md'}>
         {t('support.wallet.subscription.Sub plan tip', {
           title: feConfigs?.systemTitle
         })}
@@ -156,7 +156,7 @@ const Standard = ({
                     borderColor: 'myGray.150'
                   })}
             >
-              <Box fontSize={'lg'} fontWeight={'500'}>
+              <Box fontSize={'md'} fontWeight={'500'}>
                 {t(item.label)}
               </Box>
               <Box fontSize={['32px', '42px']} fontWeight={'bold'}>
diff --git a/projects/app/src/web/core/dataset/components/SelectCollections.tsx b/projects/app/src/web/core/dataset/components/SelectCollections.tsx
index e93f1c387..0ac9b61ef 100644
--- a/projects/app/src/web/core/dataset/components/SelectCollections.tsx
+++ b/projects/app/src/web/core/dataset/components/SelectCollections.tsx
@@ -13,6 +13,7 @@ import { useTranslation } from 'next-i18next';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetPageContext } from '../context/datasetPageContext';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const SelectCollections = ({
   datasetId,
@@ -117,7 +118,7 @@ const SelectCollections = ({
             }))}
             FirstPathDom={
               <>
-                <Box fontWeight={'bold'} fontSize={['sm', 'lg']}>
+                <Box fontWeight={'bold'} fontSize={['sm', 'md']}>
                   {title
                     ? title
                     : type === 'folder'
@@ -193,12 +194,7 @@ const SelectCollections = ({
           )}
         </Grid>
         {collections.length === 0 && (
-          <Flex mt={'20vh'} flexDirection={'column'} alignItems={'center'}>
-            <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-            <Box mt={2} color={'myGray.500'}>
-              {t('common.folder.No Folder')}
-            </Box>
-          </Flex>
+          <EmptyTip pt={'20vh'} text={t('common.folder.No Folder')}></EmptyTip>
         )}
         <Loading loading={isLoading} fixed={false} />
       </ModalBody>
diff --git a/projects/app/src/web/styles/chakraui.scss b/projects/app/src/web/styles/chakraui.scss
new file mode 100644
index 000000000..1b6597bfd
--- /dev/null
+++ b/projects/app/src/web/styles/chakraui.scss
@@ -0,0 +1,8 @@
+body input,
+body select {
+  --input-font-size: var(--chakra-fontSizes-sm) !important;
+}
+
+.chakra-tooltip {
+  font-size: var(--chakra-fontSizes-xs) !important;
+}
diff --git a/projects/app/src/web/styles/reset.scss b/projects/app/src/web/styles/reset.scss
index 75f0d282d..9eadf8fb4 100644
--- a/projects/app/src/web/styles/reset.scss
+++ b/projects/app/src/web/styles/reset.scss
@@ -1,5 +1,6 @@
 @import './reactflow.scss';
 @import './default.scss';
+@import './chakraui.scss';
 
 body,
 h1,
@@ -57,7 +58,7 @@ div {
 
 input::placeholder,
 textarea::placeholder {
-  font-size: 0.85em;
+  font-size: var(--chakra-fontSizes-mini);
 }
 
 * {