diff --git a/src/hooks/useDebouncedCallback/ko/useDebouncedCallback.md b/src/hooks/useDebouncedCallback/ko/useDebouncedCallback.md
index 5c5dff08..13487de2 100644
--- a/src/hooks/useDebouncedCallback/ko/useDebouncedCallback.md
+++ b/src/hooks/useDebouncedCallback/ko/useDebouncedCallback.md
@@ -18,7 +18,7 @@ function useDebouncedCallback(options: Object): Function;
   :nested="[
     {
       name: 'options.onChange',
-      type: 'Function',
+      type: '(newValue: T) => void',
       required: true,
       description: '디바운스할 콜백 함수예요.',
     },
@@ -52,7 +52,7 @@ function useDebouncedCallback(options: Object): Function;
 
 <Interface
   name=""
-  type="Function"
+  type="(newValue: T) => void"
   description="콜백 호출을 지연시키는 디바운스된 함수예요."
 />
 
diff --git a/src/hooks/useDebouncedCallback/useDebouncedCallback.md b/src/hooks/useDebouncedCallback/useDebouncedCallback.md
index 362ba82d..426703b8 100644
--- a/src/hooks/useDebouncedCallback/useDebouncedCallback.md
+++ b/src/hooks/useDebouncedCallback/useDebouncedCallback.md
@@ -18,7 +18,7 @@ function useDebouncedCallback(options: Object): Function;
   :nested="[
     {
       name: 'options.onChange',
-      type: 'Function',
+      type: '(newValue: T) => void',
       required: true,
       description: 'The callback function to debounce.',
     },
@@ -52,7 +52,7 @@ function useDebouncedCallback(options: Object): Function;
 
 <Interface
   name=""
-  type="Function"
+  type="(newValue: T) => void"
   description="debounced function that delays invoking the callback."
 />
 
diff --git a/src/hooks/useDebouncedCallback/useDebouncedCallback.spec.ts b/src/hooks/useDebouncedCallback/useDebouncedCallback.spec.ts
index ae610bea..4c27cfff 100644
--- a/src/hooks/useDebouncedCallback/useDebouncedCallback.spec.ts
+++ b/src/hooks/useDebouncedCallback/useDebouncedCallback.spec.ts
@@ -20,26 +20,26 @@ describe('useDebouncedCallback', () => {
     const onChange = vi.fn();
     const { result } = renderHookSSR(() => useDebouncedCallback({ onChange, timeThreshold: 100 }));
 
-    result.current(true);
+    result.current('hi');
     expect(onChange).not.toBeCalled();
 
-    result.current(true);
+    result.current('hi');
     vi.advanceTimersByTime(50);
     expect(onChange).not.toBeCalled();
 
-    result.current(false);
+    result.current(null);
     vi.advanceTimersByTime(50);
     expect(onChange).toBeCalledTimes(1);
-    expect(onChange).toBeCalledWith(true);
+    expect(onChange).toBeCalledWith('hi');
 
-    result.current(false);
+    result.current(null);
     vi.advanceTimersByTime(50);
     expect(onChange).toBeCalledTimes(1);
-    expect(onChange).toBeCalledWith(true);
+    expect(onChange).toBeCalledWith('hi');
 
     vi.advanceTimersByTime(50);
     expect(onChange).toBeCalledTimes(2);
-    expect(onChange).toBeCalledWith(false);
+    expect(onChange).toBeCalledWith(null);
   });
 
   it('should handle leading edge', () => {
diff --git a/src/hooks/useDebouncedCallback/useDebouncedCallback.ts b/src/hooks/useDebouncedCallback/useDebouncedCallback.ts
index 1ffa16b8..0c858fc5 100644
--- a/src/hooks/useDebouncedCallback/useDebouncedCallback.ts
+++ b/src/hooks/useDebouncedCallback/useDebouncedCallback.ts
@@ -16,12 +16,12 @@ type DebounceOptions = {
  * Note that if both 'leading' and 'trailing' are set, the function will be called at both the start and end of the delay period. However, it must be called at least twice within debounceMs interval for this to happen, since one debounced function call cannot trigger the function twice.
  *
  * @param {Object} options - The options object.
- * @param {Function} options.onChange - The callback function to debounce.
+ * @param {(newValue: T) => void} options.onChange - The callback function to debounce.
  * @param {number} options.timeThreshold - The number of milliseconds to delay the function execution.
  * @param {boolean} [options.leading=false] - If `true`, the function is called at the start of the sequence.
  * @param {boolean} [options.trailing=true] - If `true`, the function is called at the end of the sequence.
  *
- * @returns {Function} A debounced function that delays invoking the callback.
+ * @returns {(newValue: T) => void} A debounced function that delays invoking the callback.
  *
  * @example
  * function SearchInput() {
@@ -30,17 +30,20 @@ type DebounceOptions = {
  *   return <input type="text" onChange={(e) => debouncedSetQuery(e.target.value)} />;
  * }
  */
-export function useDebouncedCallback({
+export function useDebouncedCallback<T>({
   onChange,
   timeThreshold,
   leading = false,
   trailing = true,
 }: DebounceOptions & {
-  onChange: (newValue: boolean) => void;
+  onChange: (newValue: T) => void;
   timeThreshold: number;
 }) {
   const handleChange = usePreservedCallback(onChange);
-  const ref = useRef({ value: false, clearPreviousDebounce: () => {} });
+  const ref = useRef<{ value: T | null; clearPreviousDebounce: () => void }>({
+    value: null,
+    clearPreviousDebounce: () => {},
+  });
 
   useEffect(() => {
     const current = ref.current;
@@ -63,7 +66,7 @@ export function useDebouncedCallback({
   }, [leading, trailing]);
 
   return useCallback(
-    (nextValue: boolean) => {
+    (nextValue: T) => {
       if (nextValue === ref.current.value) {
         return;
       }