diff --git a/components/date-picker/style/index.ts b/components/date-picker/style/index.ts
index 9fca7e8e5b..82aabb4795 100644
--- a/components/date-picker/style/index.ts
+++ b/components/date-picker/style/index.ts
@@ -920,6 +920,31 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
           transition: `background ${motionDurationMid}`,
           overflowX: 'hidden',
 
+          '&::-webkit-scrollbar': {
+            width: '7px',
+            backgroundColor: ' #f1f1f1',
+          },
+
+          '&::-webkit-scrollbar-thumb': {
+            backgroundColor: '#b6b2b2',
+            borderRadius: '5px',
+          },
+
+          '&::-webkit-scrollbar-thumb:hover': {
+            backgroundColor: '#7a7a7a',
+          },
+          // 兼容firefox
+          '&': {
+            scrollbarWidth: 'thin',
+            scrollbarColor: `#b6b2b2 #f1f1f1`,
+          },
+          '&::-moz-scrollbar-thumb': {
+            backgroundColor: '#b6b2b2',
+          },
+          '&::-moz-scrollbar-track': {
+            backgroundColor: ' #f1f1f1',
+          },
+
           '&::after': {
             display: 'block',
             height: timeColumnHeight - timeCellHeight,