diff --git a/README.md b/README.md
index cf26cf0dc..99b02a83e 100644
--- a/README.md
+++ b/README.md
@@ -62,6 +62,31 @@ You can use `onSelect` event handler which fires each time some calendar date ha
See [here](https://github.com/Hacker0x01/react-datepicker/blob/main/docs/datepicker.md) for a full list of props that may be passed to the component. Examples are given on the [main website](https://hacker0x01.github.io/react-datepicker).
+### Working with Examples
+
+When using examples from the documentation site, note that they may reference utilities from external libraries. Common imports you might need:
+
+**Date manipulation** (from `date-fns`):
+
+```js
+import { getYear, getMonth, addDays, subDays, setHours, setMinutes } from "date-fns";
+```
+
+**Utility functions**:
+
+- For `range()` function used in custom headers: `import range from "lodash/range";`
+- Or implement your own: `const range = (start, end, step) => Array.from({ length: (end - start) / step }, (_, i) => start + i * step);`
+
+**TypeScript types**:
+
+```ts
+import type { ReactDatePickerCustomHeaderProps } from "react-datepicker";
+```
+
+All examples on the documentation site include commented import statements at the top showing exactly what you need to import for your own project.
+
+For a comprehensive guide on imports, see the [Common Imports Guide](https://github.com/Hacker0x01/react-datepicker/blob/main/docs/imports-guide.md).
+
### Time picker
You can also include a time picker by adding the showTimeSelect prop
diff --git a/docs/imports-guide.md b/docs/imports-guide.md
new file mode 100644
index 000000000..3d2179494
--- /dev/null
+++ b/docs/imports-guide.md
@@ -0,0 +1,220 @@
+# Common Imports Guide
+
+When using examples from the react-datepicker documentation, you may need to import additional utilities and types. This guide provides a comprehensive reference for common imports.
+
+## Basic Setup
+
+Every react-datepicker implementation requires these basic imports:
+
+```tsx
+import React, { useState } from "react";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+```
+
+For CSS Modules:
+
+```tsx
+import "react-datepicker/dist/react-datepicker-cssmodules.css";
+// or
+import "react-datepicker/dist/react-datepicker.module.css";
+```
+
+## Date Manipulation (date-fns)
+
+React-datepicker uses `date-fns` internally. When working with dates in your examples, you'll often need these functions:
+
+### Common date-fns Functions
+
+```tsx
+import { getYear, getMonth, addDays, subDays, addMonths, subMonths, addYears, subYears, setHours, setMinutes, setSeconds, startOfDay, endOfDay, isAfter, isBefore, isEqual, format, parse } from "date-fns";
+```
+
+### Usage Examples
+
+**Custom Header with Year/Month Dropdowns:**
+
+```tsx
+import { getYear, getMonth } from "date-fns";
+
+const year = getYear(new Date());
+const month = getMonth(new Date()); // Returns 0-11
+```
+
+**Date Ranges and Highlighting:**
+
+```tsx
+import { addDays, subDays } from "date-fns";
+
+const tomorrow = addDays(new Date(), 1);
+const yesterday = subDays(new Date(), 1);
+```
+
+**Time Manipulation:**
+
+```tsx
+import { setHours, setMinutes } from "date-fns";
+
+const nineAM = setHours(setMinutes(new Date(), 0), 9);
+```
+
+## Utility Functions
+
+### Range Function
+
+Many examples use a `range()` function to generate arrays of numbers (e.g., for year dropdowns).
+
+**Option 1: Install lodash**
+
+```bash
+npm install lodash
+# or
+yarn add lodash
+```
+
+```tsx
+import range from "lodash/range";
+
+const years = range(1990, 2030, 1); // [1990, 1991, ..., 2029]
+```
+
+**Option 2: Implement your own**
+
+```tsx
+const range = (start: number, end: number, step: number = 1): number[] => {
+ return Array.from({ length: (end - start) / step }, (_, i) => start + i * step);
+};
+
+const years = range(1990, 2030, 1); // [1990, 1991, ..., 2029]
+```
+
+## TypeScript Types
+
+React-datepicker exports several useful TypeScript types:
+
+```tsx
+import type { ReactDatePickerCustomHeaderProps, ReactDatePickerProps } from "react-datepicker";
+```
+
+### Custom Header Props
+
+When creating a custom header, use the `ReactDatePickerCustomHeaderProps` type:
+
+```tsx
+import type { ReactDatePickerCustomHeaderProps } from "react-datepicker";
+
+const CustomHeader = ({ date, changeYear, changeMonth, decreaseMonth, increaseMonth, prevMonthButtonDisabled, nextMonthButtonDisabled }: ReactDatePickerCustomHeaderProps) => {
+ // Your custom header implementation
+};
+```
+
+## Localization
+
+To use a locale other than English:
+
+```tsx
+import { registerLocale, setDefaultLocale } from "react-datepicker";
+import { es } from "date-fns/locale/es";
+import { fr } from "date-fns/locale/fr";
+import { de } from "date-fns/locale/de";
+
+registerLocale("es", es);
+registerLocale("fr", fr);
+registerLocale("de", de);
+
+// Use in component
+