diff --git a/src/files-ui/components/dropzone/components/dropzone/Dropzone.tsx b/src/files-ui/components/dropzone/components/dropzone/Dropzone.tsx
index 8b88e1ce79e14b569f25855e4c37b11b64f90d65..4b26c9d10d7689525d48603655b87a36c54936fe 100644
--- a/src/files-ui/components/dropzone/components/dropzone/Dropzone.tsx
+++ b/src/files-ui/components/dropzone/components/dropzone/Dropzone.tsx
@@ -672,13 +672,21 @@ const Dropzone: React.FC<DropzoneProps> = (props: DropzoneProps) => {
   };
   console.log("Dropzone styleHeader", styleHeader);
 
-  const finalDropzoneClassName: string | undefined = !dropzoneClassName
+  const finalDropzoneClassNameBorder: string | undefined = !dropzoneClassName
     ? undefined
     : isDragging || disabled
     ? addClassName(dropzoneClassName, "files-ui-root-border-hide")
     : dropzoneClassName;
 
-  if (!finalDropzoneClassName) return <></>;
+  const finalDropzoneClassNameBorderClickable: string | undefined =
+    !finalDropzoneClassNameBorder
+      ? undefined
+      : clickable && !disabled
+      ? addClassName(finalDropzoneClassNameBorder, "clickable")
+      : finalDropzoneClassNameBorder;
+
+  if (!finalDropzoneClassNameBorderClickable) return <></>;
+
   return (
     <React.Fragment>
       {actionButtonsPosition === "top" && (
@@ -702,7 +710,7 @@ const Dropzone: React.FC<DropzoneProps> = (props: DropzoneProps) => {
       )}
       <div
         style={style}
-        className={finalDropzoneClassName}
+        className={finalDropzoneClassNameBorderClickable}
         {...rest}
         onClick={handleClick}
         onDragOver={handleDragEnter}