diff --git a/db/TDesign.db b/db/TDesign.db
index 2261a14c..d3b64dc3 100644
Binary files a/db/TDesign.db and b/db/TDesign.db differ
diff --git a/packages/products/tdesign-miniprogram/src/color-picker/README.en-US.md b/packages/products/tdesign-miniprogram/src/color-picker/README.en-US.md
index d12b3f41..7c5d2cf7 100644
--- a/packages/products/tdesign-miniprogram/src/color-picker/README.en-US.md
+++ b/packages/products/tdesign-miniprogram/src/color-picker/README.en-US.md
@@ -8,16 +8,21 @@ name | type | default | description | required
 -- | -- | -- | -- | --
 style | Object | - | CSS(Cascading Style Sheets) | N
 custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N
+auto-close | Boolean | true | \- | N
 enable-alpha | Boolean | false | \- | N
 format | String | RGB | options: RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
+popup-props | Object | {} | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
 swatch-colors | Array | - | swatch colors。Typescript：`Array<string> \| null` | N
 type | String | base | options: base/multiple。Typescript：`TypeEnum ` `type TypeEnum = 'base' \| 'multiple'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
+use-popup | Boolean | false | \- | N
 value | String | - | color value | N
 default-value | String | undefined | color value。uncontrolled property | N
+visible | Boolean | false | \- | N
 
 ### ColorPicker Events
 
 name | params | description
 -- | -- | --
 change | `(value: string, context: { color: ColorObject; trigger: ColorPickerChangeTrigger })` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerChangeTrigger = 'palette-hue-bar' \| 'palette-alpha-bar' \| 'preset' `<br/>
+close | `(trigger: ColorPickerTrigger)` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerTrigger = 'overlay'`<br/>
 palette-bar-change | `(detail: { color: ColorObject })` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`interface ColorObject { alpha: number; css: string; hex: string; hex8: string; hsl: string; hsla: string; hsv: string; hsva: string; rgb: string; rgba: string; value: number;}`<br/>
diff --git a/packages/products/tdesign-miniprogram/src/color-picker/README.md b/packages/products/tdesign-miniprogram/src/color-picker/README.md
index 4bd4a3e7..a5510c2c 100644
--- a/packages/products/tdesign-miniprogram/src/color-picker/README.md
+++ b/packages/products/tdesign-miniprogram/src/color-picker/README.md
@@ -8,16 +8,21 @@
 -- | -- | -- | -- | --
 style | Object | - | 样式 | N
 custom-style | Object | - | 样式，一般用于开启虚拟化组件节点场景 | N
+auto-close | Boolean | true | 自动关闭。在点击遮罩层时自动关闭，不需要手动设置 visible | N
 enable-alpha | Boolean | false | 是否开启透明通道 | N
 format | String | RGB | 格式化色值。`enableAlpha` 为真时，`RGBA/HSLA/HSVA` 等值有效。可选项：RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
+popup-props | Object | {} | popupProps透传。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
 swatch-colors | Array | - | 系统预设的颜色样例，值为 `null` 或 `[]` 则不显示系统色，值为 `undefined` 会显示组件内置的系统默认色。TS 类型：`Array<string> \| null` | N
 type | String | base | 颜色选择器类型。（base 表示仅展示系统预设内容; multiple 表示展示色板和系统预设内容。可选项：base/multiple。TS 类型：`TypeEnum ` `type TypeEnum = 'base' \| 'multiple'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
+use-popup | Boolean | false | 是否使用弹出层包裹颜色选择器 | N
 value | String | - | 色值 | N
 default-value | String | undefined | 色值。非受控属性 | N
+visible | Boolean | false | 是否显示颜色选择器。`usePopup` 为 true 时有效 | N
 
 ### ColorPicker Events
 
 名称 | 参数 | 描述
 -- | -- | --
 change | `(value: string, context: { color: ColorObject; trigger: ColorPickerChangeTrigger })` | 选中的色值发生变化时触发，第一个参数 `value` 表示新色值，`context.color` 表示当前调色板控制器的色值，`context.trigger` 表示触发颜色变化的来源。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerChangeTrigger = 'palette-hue-bar' \| 'palette-alpha-bar' \| 'preset' `<br/>
+close | `(trigger: ColorPickerTrigger)` | 关闭按钮时触发。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerTrigger = 'overlay'`<br/>
 palette-bar-change | `(detail: { color: ColorObject })` | 调色板控制器的值变化时触发，`context.color` 指调色板控制器的值。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`interface ColorObject { alpha: number; css: string; hex: string; hex8: string; hsl: string; hsla: string; hsv: string; hsva: string; rgb: string; rgba: string; value: number;}`<br/>
diff --git a/packages/products/tdesign-miniprogram/src/color-picker/props.ts b/packages/products/tdesign-miniprogram/src/color-picker/props.ts
index f84e06ec..70ca8b2b 100644
--- a/packages/products/tdesign-miniprogram/src/color-picker/props.ts
+++ b/packages/products/tdesign-miniprogram/src/color-picker/props.ts
@@ -6,6 +6,11 @@
 
 import { TdColorPickerProps } from './type';
 const props: TdColorPickerProps = {
+  /** 自动关闭。在点击遮罩层时自动关闭，不需要手动设置 visible */
+  autoClose: {
+    type: Boolean,
+    value: true,
+  },
   /** 是否开启透明通道 */
   enableAlpha: {
     type: Boolean,
@@ -16,6 +21,11 @@ const props: TdColorPickerProps = {
     type: String,
     value: 'RGB',
   },
+  /** popupProps透传 */
+  popupProps: {
+    type: Object,
+    value: {},
+  },
   /** 系统预设的颜色样例，值为 `null` 或 `[]` 则不显示系统色，值为 `undefined` 会显示组件内置的系统默认色 */
   swatchColors: {
     type: Array,
@@ -25,6 +35,11 @@ const props: TdColorPickerProps = {
     type: String,
     value: 'base',
   },
+  /** 是否使用弹出层包裹颜色选择器 */
+  usePopup: {
+    type: Boolean,
+    value: false,
+  },
   /** 色值 */
   value: {
     type: String,
@@ -35,6 +50,11 @@ const props: TdColorPickerProps = {
     type: String,
     value: '',
   },
+  /** 是否显示颜色选择器。`usePopup` 为 true 时有效 */
+  visible: {
+    type: Boolean,
+    value: false,
+  },
 };
 
 export default props;
diff --git a/packages/products/tdesign-miniprogram/src/color-picker/type.ts b/packages/products/tdesign-miniprogram/src/color-picker/type.ts
index f57ebe2e..6f331652 100644
--- a/packages/products/tdesign-miniprogram/src/color-picker/type.ts
+++ b/packages/products/tdesign-miniprogram/src/color-picker/type.ts
@@ -4,7 +4,17 @@
  * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
  * */
 
+import { PopupProps } from '../popup/index';
+
 export interface TdColorPickerProps {
+  /**
+   * 自动关闭。在点击遮罩层时自动关闭，不需要手动设置 visible
+   * @default true
+   */
+  autoClose?: {
+    type: BooleanConstructor;
+    value?: boolean;
+  };
   /**
    * 是否开启透明通道
    * @default false
@@ -21,6 +31,14 @@ export interface TdColorPickerProps {
     type: StringConstructor;
     value?: 'RGB' | 'RGBA' | 'HSL' | 'HSLA' | 'HSB' | 'HSV' | 'HSVA' | 'HEX' | 'CMYK' | 'CSS';
   };
+  /**
+   * popupProps透传
+   * @default {}
+   */
+  popupProps?: {
+    type: ObjectConstructor;
+    value?: PopupProps;
+  };
   /**
    * 系统预设的颜色样例，值为 `null` 或 `[]` 则不显示系统色，值为 `undefined` 会显示组件内置的系统默认色
    */
@@ -36,6 +54,14 @@ export interface TdColorPickerProps {
     type: StringConstructor;
     value?: TypeEnum;
   };
+  /**
+   * 是否使用弹出层包裹颜色选择器
+   * @default false
+   */
+  usePopup?: {
+    type: BooleanConstructor;
+    value?: boolean;
+  };
   /**
    * 色值
    * @default ''
@@ -52,6 +78,14 @@ export interface TdColorPickerProps {
     type: StringConstructor;
     value?: string;
   };
+  /**
+   * 是否显示颜色选择器。`usePopup` 为 true 时有效
+   * @default false
+   */
+  visible?: {
+    type: BooleanConstructor;
+    value?: boolean;
+  };
 }
 
 export type TypeEnum = 'base' | 'multiple';
diff --git a/packages/scripts/api.json b/packages/scripts/api.json
index 5a3ecd8c..a0610ab4 100644
--- a/packages/scripts/api.json
+++ b/packages/scripts/api.json
@@ -28748,6 +28748,49 @@
       ],
       "field_type_text": []
     },
+    {
+      "id": 1730970180,
+      "platform_framework": [
+        "8",
+        "16",
+        "32",
+        "64"
+      ],
+      "component": "ColorPicker",
+      "field_category": 1,
+      "field_name": "autoClose",
+      "field_type": [
+        "4"
+      ],
+      "field_default_value": "true",
+      "field_enum": "",
+      "field_desc_zh": "自动关闭。在点击遮罩层时自动关闭，不需要手动设置 visible",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-11-07 09:03:00",
+      "update_time": "2024-11-07 09:03:00",
+      "event_output": null,
+      "custom_field_type": null,
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Props",
+      "platform_framework_text": [
+        "Vue(Mobile)",
+        "React(Mobile)",
+        "Angular(Mobile)",
+        "Miniprogram"
+      ],
+      "field_type_text": [
+        "Boolean"
+      ]
+    },
     {
       "id": 1715162325,
       "platform_framework": [
@@ -29213,6 +29256,49 @@
         "Object"
       ]
     },
+    {
+      "id": 1730984839,
+      "platform_framework": [
+        "8",
+        "16",
+        "32",
+        "64"
+      ],
+      "component": "ColorPicker",
+      "field_category": 1,
+      "field_name": "popupProps",
+      "field_type": [
+        "8"
+      ],
+      "field_default_value": "{}",
+      "field_enum": "",
+      "field_desc_zh": "popupProps透传",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-11-07 13:07:19",
+      "update_time": "2024-11-07 13:07:19",
+      "event_output": null,
+      "custom_field_type": "PopupProps【import { PopupProps } from '@Popup'】",
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Props",
+      "platform_framework_text": [
+        "Vue(Mobile)",
+        "React(Mobile)",
+        "Angular(Mobile)",
+        "Miniprogram"
+      ],
+      "field_type_text": [
+        "Object"
+      ]
+    },
     {
       "id": 2342,
       "platform_framework": [
@@ -29457,6 +29543,49 @@
         "String"
       ]
     },
+    {
+      "id": 1730970213,
+      "platform_framework": [
+        "8",
+        "16",
+        "32",
+        "64"
+      ],
+      "component": "ColorPicker",
+      "field_category": 1,
+      "field_name": "usePopup",
+      "field_type": [
+        "4"
+      ],
+      "field_default_value": "false",
+      "field_enum": "",
+      "field_desc_zh": "是否使用弹出层包裹颜色选择器",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-11-07 09:03:33",
+      "update_time": "2024-11-07 09:03:33",
+      "event_output": null,
+      "custom_field_type": null,
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Props",
+      "platform_framework_text": [
+        "Vue(Mobile)",
+        "React(Mobile)",
+        "Angular(Mobile)",
+        "Miniprogram"
+      ],
+      "field_type_text": [
+        "Boolean"
+      ]
+    },
     {
       "id": 2118,
       "platform_framework": [
@@ -29535,6 +29664,49 @@
         "String"
       ]
     },
+    {
+      "id": 1730970283,
+      "platform_framework": [
+        "8",
+        "16",
+        "32",
+        "64"
+      ],
+      "component": "ColorPicker",
+      "field_category": 1,
+      "field_name": "visible",
+      "field_type": [
+        "4"
+      ],
+      "field_default_value": "false",
+      "field_enum": "",
+      "field_desc_zh": "是否显示颜色选择器。`usePopup` 为 true 时有效",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-11-07 09:04:43",
+      "update_time": "2024-11-07 09:04:43",
+      "event_output": null,
+      "custom_field_type": null,
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Props",
+      "platform_framework_text": [
+        "Vue(Mobile)",
+        "React(Mobile)",
+        "Angular(Mobile)",
+        "Miniprogram"
+      ],
+      "field_type_text": [
+        "Boolean"
+      ]
+    },
     {
       "id": 2126,
       "platform_framework": [
@@ -29605,6 +29777,45 @@
       ],
       "field_type_text": []
     },
+    {
+      "id": 1730970251,
+      "platform_framework": [
+        "8",
+        "16",
+        "32",
+        "64"
+      ],
+      "component": "ColorPicker",
+      "field_category": 2,
+      "field_name": "close",
+      "field_type": [],
+      "field_default_value": "",
+      "field_enum": "",
+      "field_desc_zh": "关闭按钮时触发",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "(trigger: ColorPickerTrigger)【type ColorPickerTrigger = 'overlay'】",
+      "create_time": "2024-11-07 09:04:11",
+      "update_time": "2024-11-07 09:04:11",
+      "event_output": null,
+      "custom_field_type": null,
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Events",
+      "platform_framework_text": [
+        "Vue(Mobile)",
+        "React(Mobile)",
+        "Angular(Mobile)",
+        "Miniprogram"
+      ],
+      "field_type_text": []
+    },
     {
       "id": 2125,
       "platform_framework": [