diff --git a/package-lock.json b/package-lock.json
index 94a9b28cfab..e392bfd256f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15502,18 +15502,12 @@
       }
     },
     "node_modules/date-fns": {
-      "version": "2.30.0",
-      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz",
-      "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==",
-      "dependencies": {
-        "@babel/runtime": "^7.21.0"
-      },
-      "engines": {
-        "node": ">=0.11"
-      },
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-3.3.1.tgz",
+      "integrity": "sha512-y8e109LYGgoQDveiEBD3DYXKba1jWf5BA8YU1FL5Tvm0BTdEfy54WLCwnuYWZNnzzvALy/QQ4Hov+Q9RVRv+Zw==",
       "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/date-fns"
+        "type": "github",
+        "url": "https://github.com/sponsors/kossnocorp"
       }
     },
     "node_modules/date.js": {
@@ -55128,7 +55122,7 @@
       "license": "Apache-2.0",
       "dependencies": {
         "@zendeskgarden/container-utilities": "^2.0.0",
-        "date-fns": "^2.0.0-beta.2",
+        "date-fns": "^3.0.0",
         "prop-types": "^15.5.7",
         "react-popper": "^1.3.4"
       },
diff --git a/packages/datepickers/package.json b/packages/datepickers/package.json
index cea5080fa17..8fe868f2287 100644
--- a/packages/datepickers/package.json
+++ b/packages/datepickers/package.json
@@ -22,7 +22,7 @@
   "types": "dist/typings/index.d.ts",
   "dependencies": {
     "@zendeskgarden/container-utilities": "^2.0.0",
-    "date-fns": "^2.0.0-beta.2",
+    "date-fns": "^3.0.0",
     "prop-types": "^15.5.7",
     "react-popper": "^1.3.4"
   },
diff --git a/packages/datepickers/src/elements/Datepicker/Datepicker.spec.tsx b/packages/datepickers/src/elements/Datepicker/Datepicker.spec.tsx
index dae3ededf5f..2a12a2ad53b 100644
--- a/packages/datepickers/src/elements/Datepicker/Datepicker.spec.tsx
+++ b/packages/datepickers/src/elements/Datepicker/Datepicker.spec.tsx
@@ -8,7 +8,8 @@
 import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { render, renderRtl, fireEvent, act } from 'garden-test-utils';
-import { addDays, subDays } from 'date-fns';
+import { addDays } from 'date-fns/addDays';
+import { subDays } from 'date-fns/subDays';
 import mockDate from 'mockdate';
 import { KEYS } from '@zendeskgarden/container-utilities';
 import { Datepicker } from './Datepicker';
diff --git a/packages/datepickers/src/elements/Datepicker/components/Calendar.tsx b/packages/datepickers/src/elements/Datepicker/components/Calendar.tsx
index 0149d0c86a9..616bd5fd16b 100644
--- a/packages/datepickers/src/elements/Datepicker/components/Calendar.tsx
+++ b/packages/datepickers/src/elements/Datepicker/components/Calendar.tsx
@@ -6,18 +6,18 @@
  */
 
 import React, { forwardRef, HTMLAttributes, useCallback } from 'react';
-import startOfMonth from 'date-fns/startOfMonth';
-import endOfMonth from 'date-fns/endOfMonth';
-import startOfWeek from 'date-fns/startOfWeek';
-import endOfWeek from 'date-fns/endOfWeek';
-import eachDayOfInterval from 'date-fns/eachDayOfInterval';
-import addDays from 'date-fns/addDays';
-import isToday from 'date-fns/isToday';
-import isSameDay from 'date-fns/isSameDay';
-import isSameMonth from 'date-fns/isSameMonth';
-import isBefore from 'date-fns/isBefore';
-import isAfter from 'date-fns/isAfter';
-import getDate from 'date-fns/getDate';
+import { startOfMonth } from 'date-fns/startOfMonth';
+import { endOfMonth } from 'date-fns/endOfMonth';
+import { startOfWeek } from 'date-fns/startOfWeek';
+import { endOfWeek } from 'date-fns/endOfWeek';
+import { eachDayOfInterval } from 'date-fns/eachDayOfInterval';
+import { addDays } from 'date-fns/addDays';
+import { isToday } from 'date-fns/isToday';
+import { isSameDay } from 'date-fns/isSameDay';
+import { isSameMonth } from 'date-fns/isSameMonth';
+import { isBefore } from 'date-fns/isBefore';
+import { isAfter } from 'date-fns/isAfter';
+import { getDate } from 'date-fns/getDate';
 import {
   StyledDatepicker,
   StyledCalendar,
diff --git a/packages/datepickers/src/elements/Datepicker/utils/datepicker-reducer.ts b/packages/datepickers/src/elements/Datepicker/utils/datepicker-reducer.ts
index 6f2709e2b85..847b542ff45 100644
--- a/packages/datepickers/src/elements/Datepicker/utils/datepicker-reducer.ts
+++ b/packages/datepickers/src/elements/Datepicker/utils/datepicker-reducer.ts
@@ -5,12 +5,12 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 
-import addMonths from 'date-fns/addMonths';
-import subMonths from 'date-fns/subMonths';
-import isValid from 'date-fns/isValid';
-import parse from 'date-fns/parse';
-import isBefore from 'date-fns/isBefore';
-import isSameDay from 'date-fns/isSameDay';
+import { addMonths } from 'date-fns/addMonths';
+import { subMonths } from 'date-fns/subMonths';
+import { isValid } from 'date-fns/isValid';
+import { parse } from 'date-fns/parse';
+import { isBefore } from 'date-fns/isBefore';
+import { isSameDay } from 'date-fns/isSameDay';
 import { IDatepickerProps } from '../../../types';
 
 export interface IDatepickerState {
diff --git a/packages/datepickers/src/elements/DatepickerRange/DatepickerRange.spec.tsx b/packages/datepickers/src/elements/DatepickerRange/DatepickerRange.spec.tsx
index e060a4ec07c..e802906e24f 100644
--- a/packages/datepickers/src/elements/DatepickerRange/DatepickerRange.spec.tsx
+++ b/packages/datepickers/src/elements/DatepickerRange/DatepickerRange.spec.tsx
@@ -8,7 +8,10 @@
 import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { render, getAllByTestId as globalGetAllByTestId, renderRtl } from 'garden-test-utils';
-import { addDays, subDays, addMonths, subMonths } from 'date-fns';
+import { addDays } from 'date-fns/addDays';
+import { subDays } from 'date-fns/subDays';
+import { addMonths } from 'date-fns/addMonths';
+import { subMonths } from 'date-fns/subMonths';
 import mockDate from 'mockdate';
 import { DatepickerRange } from './DatepickerRange';
 import { IDatepickerRangeProps } from '../../types';
diff --git a/packages/datepickers/src/elements/DatepickerRange/components/Calendar.tsx b/packages/datepickers/src/elements/DatepickerRange/components/Calendar.tsx
index 0cc344210dd..57c99e95004 100644
--- a/packages/datepickers/src/elements/DatepickerRange/components/Calendar.tsx
+++ b/packages/datepickers/src/elements/DatepickerRange/components/Calendar.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { forwardRef, HTMLAttributes } from 'react';
-import addMonths from 'date-fns/addMonths';
+import { addMonths } from 'date-fns/addMonths';
 
 import { StyledRangeCalendar } from '../../../styled';
 import useDatepickerRangeContext from '../utils/useDatepickerRangeContext';
diff --git a/packages/datepickers/src/elements/DatepickerRange/components/End.tsx b/packages/datepickers/src/elements/DatepickerRange/components/End.tsx
index a52e8a65b29..ee2761a681e 100644
--- a/packages/datepickers/src/elements/DatepickerRange/components/End.tsx
+++ b/packages/datepickers/src/elements/DatepickerRange/components/End.tsx
@@ -7,8 +7,8 @@
 
 import React, { PropsWithChildren, HTMLAttributes, useCallback } from 'react';
 import { KEYS, composeEventHandlers } from '@zendeskgarden/container-utilities';
-import isValid from 'date-fns/isValid';
-import isSameDay from 'date-fns/isSameDay';
+import { isValid } from 'date-fns/isValid';
+import { isSameDay } from 'date-fns/isSameDay';
 import { parseInputValue } from '../utils/datepicker-range-reducer';
 import useDatepickerRangeContext from '../utils/useDatepickerRangeContext';
 
diff --git a/packages/datepickers/src/elements/DatepickerRange/components/Month.tsx b/packages/datepickers/src/elements/DatepickerRange/components/Month.tsx
index e9db30936a7..307267fd34a 100644
--- a/packages/datepickers/src/elements/DatepickerRange/components/Month.tsx
+++ b/packages/datepickers/src/elements/DatepickerRange/components/Month.tsx
@@ -6,19 +6,19 @@
  */
 
 import React, { forwardRef, HTMLAttributes, useCallback } from 'react';
-import startOfMonth from 'date-fns/startOfMonth';
-import endOfMonth from 'date-fns/endOfMonth';
-import startOfWeek from 'date-fns/startOfWeek';
-import endOfWeek from 'date-fns/endOfWeek';
-import eachDayOfInterval from 'date-fns/eachDayOfInterval';
-import addDays from 'date-fns/addDays';
-import isToday from 'date-fns/isToday';
-import isSameDay from 'date-fns/isSameDay';
-import isSameMonth from 'date-fns/isSameMonth';
-import isBefore from 'date-fns/isBefore';
-import isAfter from 'date-fns/isAfter';
-import subDays from 'date-fns/subDays';
-import compareAsc from 'date-fns/compareAsc';
+import { startOfMonth } from 'date-fns/startOfMonth';
+import { endOfMonth } from 'date-fns/endOfMonth';
+import { startOfWeek } from 'date-fns/startOfWeek';
+import { endOfWeek } from 'date-fns/endOfWeek';
+import { eachDayOfInterval } from 'date-fns/eachDayOfInterval';
+import { addDays } from 'date-fns/addDays';
+import { isToday } from 'date-fns/isToday';
+import { isSameDay } from 'date-fns/isSameDay';
+import { isSameMonth } from 'date-fns/isSameMonth';
+import { isBefore } from 'date-fns/isBefore';
+import { isAfter } from 'date-fns/isAfter';
+import { subDays } from 'date-fns/subDays';
+import { compareAsc } from 'date-fns/compareAsc';
 import ChevronLeftStrokeIcon from '@zendeskgarden/svg-icons/src/16/chevron-left-stroke.svg';
 import ChevronRightStrokeIcon from '@zendeskgarden/svg-icons/src/16/chevron-right-stroke.svg';
 import {
diff --git a/packages/datepickers/src/elements/DatepickerRange/components/Start.tsx b/packages/datepickers/src/elements/DatepickerRange/components/Start.tsx
index da3a640d488..c79f52376ff 100644
--- a/packages/datepickers/src/elements/DatepickerRange/components/Start.tsx
+++ b/packages/datepickers/src/elements/DatepickerRange/components/Start.tsx
@@ -8,8 +8,8 @@
 import React, { PropsWithChildren, HTMLAttributes, useCallback } from 'react';
 import useDatepickerRangeContext from '../utils/useDatepickerRangeContext';
 import { KEYS, composeEventHandlers } from '@zendeskgarden/container-utilities';
-import isValid from 'date-fns/isValid';
-import isSameDay from 'date-fns/isSameDay';
+import { isValid } from 'date-fns/isValid';
+import { isSameDay } from 'date-fns/isSameDay';
 import { parseInputValue } from '../utils/datepicker-range-reducer';
 
 export const Start = (props: PropsWithChildren<HTMLAttributes<HTMLInputElement>>) => {
diff --git a/packages/datepickers/src/elements/DatepickerRange/utils/datepicker-range-reducer.ts b/packages/datepickers/src/elements/DatepickerRange/utils/datepicker-range-reducer.ts
index be6fc3b080e..ec5c0a43474 100644
--- a/packages/datepickers/src/elements/DatepickerRange/utils/datepicker-range-reducer.ts
+++ b/packages/datepickers/src/elements/DatepickerRange/utils/datepicker-range-reducer.ts
@@ -5,16 +5,16 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 
-import addMonths from 'date-fns/addMonths';
-import subMonths from 'date-fns/subMonths';
-import isBefore from 'date-fns/isBefore';
-import isValid from 'date-fns/isValid';
-import isSameDay from 'date-fns/isSameDay';
-import endOfMonth from 'date-fns/endOfMonth';
-import parse from 'date-fns/parse';
-import startOfMonth from 'date-fns/startOfMonth';
-import compareAsc from 'date-fns/compareAsc';
-import isAfter from 'date-fns/isAfter';
+import { addMonths } from 'date-fns/addMonths';
+import { subMonths } from 'date-fns/subMonths';
+import { isBefore } from 'date-fns/isBefore';
+import { isValid } from 'date-fns/isValid';
+import { isSameDay } from 'date-fns/isSameDay';
+import { endOfMonth } from 'date-fns/endOfMonth';
+import { parse } from 'date-fns/parse';
+import { startOfMonth } from 'date-fns/startOfMonth';
+import { compareAsc } from 'date-fns/compareAsc';
+import { isAfter } from 'date-fns/isAfter';
 import { IDatepickerRangeProps } from '../../../types';
 
 export interface IDatepickerRangeState {