diff --git a/front/components/assistant/conversation/ConversationContainer.tsx b/front/components/assistant/conversation/ConversationContainer.tsx
index 680c961e48fe..4c0af8a6d1a5 100644
--- a/front/components/assistant/conversation/ConversationContainer.tsx
+++ b/front/components/assistant/conversation/ConversationContainer.tsx
@@ -244,7 +244,10 @@ export function ConversationContainer({
   );
 
   return (
-    <DropzoneContainer dropMessage="Drag and drop files here to include them in the conversation.">
+    <DropzoneContainer
+      description="Drag and drop your text files (txt, doc, pdf) and image files (jpg, png) here."
+      title="Attach files to the conversation"
+    >
       <Transition
         show={!!activeConversationId}
         as={Fragment}
diff --git a/front/components/misc/DropzoneContainer.tsx b/front/components/misc/DropzoneContainer.tsx
index 3757288bac0e..447d2bf98fda 100644
--- a/front/components/misc/DropzoneContainer.tsx
+++ b/front/components/misc/DropzoneContainer.tsx
@@ -1,16 +1,18 @@
-import { ArrowDownOnSquareIcon, Icon } from "@dust-tt/sparkle";
+import { DropzoneOverlay } from "@dust-tt/sparkle";
 import { useDropzone } from "react-dropzone";
 
 import { useFileDrop } from "@app/components/assistant/conversation/FileUploaderContext";
 
 interface DropzoneContainerProps {
   children: React.ReactNode;
-  dropMessage: string;
+  description: string;
+  title: string;
 }
 
 export function DropzoneContainer({
   children,
-  dropMessage,
+  description,
+  title,
 }: DropzoneContainerProps) {
   const { setDroppedFiles } = useFileDrop();
 
@@ -28,12 +30,11 @@ export function DropzoneContainer({
       {...getRootProps()}
       className="flex h-full w-full flex-col items-center"
     >
-      {isDragActive && (
-        <div className="absolute inset-0 z-50 flex items-center justify-center bg-blue-100 bg-opacity-80 text-element-700">
-          <Icon visual={ArrowDownOnSquareIcon} />
-          <p className="text-lg font-semibold">{dropMessage}</p>
-        </div>
-      )}
+      <DropzoneOverlay
+        description={description}
+        isDragActive={isDragActive}
+        title={title}
+      />
       {children}
     </div>
   );
diff --git a/front/package-lock.json b/front/package-lock.json
index 1f8abcb9f64d..37516fa29d9d 100644
--- a/front/package-lock.json
+++ b/front/package-lock.json
@@ -9,7 +9,7 @@
         "@amplitude/analytics-browser": "^2.5.2",
         "@amplitude/analytics-node": "^1.3.5",
         "@auth0/nextjs-auth0": "^3.5.0",
-        "@dust-tt/sparkle": "^0.2.189",
+        "@dust-tt/sparkle": "^0.2.190",
         "@dust-tt/types": "file:../types",
         "@emoji-mart/data": "^1.1.2",
         "@emoji-mart/react": "^1.1.1",
@@ -10734,9 +10734,9 @@
       "license": "Apache-2.0"
     },
     "node_modules/@dust-tt/sparkle": {
-      "version": "0.2.189",
-      "resolved": "https://registry.npmjs.org/@dust-tt/sparkle/-/sparkle-0.2.189.tgz",
-      "integrity": "sha512-HL7p8oeiNOZmie/DGvfx+JtVw6ZpK3CE53cqdbOLFwSy/ImWLrCpqIW6HKs86+T+iojkYYwGjwmVppqWp9zIJw==",
+      "version": "0.2.190",
+      "resolved": "https://registry.npmjs.org/@dust-tt/sparkle/-/sparkle-0.2.190.tgz",
+      "integrity": "sha512-ErmlgHpflKFujCnzscMi1WRoHImVAPNR8rEdSCXoecpaDlOO4fYcthEj3EvYPq74enxkG3vdMOQt2asRfrFdQg==",
       "dependencies": {
         "@emoji-mart/data": "^1.1.2",
         "@emoji-mart/react": "^1.1.1",
diff --git a/front/package.json b/front/package.json
index d61cb32457b1..b195cd11d153 100644
--- a/front/package.json
+++ b/front/package.json
@@ -21,7 +21,7 @@
     "@amplitude/analytics-browser": "^2.5.2",
     "@amplitude/analytics-node": "^1.3.5",
     "@auth0/nextjs-auth0": "^3.5.0",
-    "@dust-tt/sparkle": "^0.2.189",
+    "@dust-tt/sparkle": "^0.2.190",
     "@dust-tt/types": "file:../types",
     "@emoji-mart/data": "^1.1.2",
     "@emoji-mart/react": "^1.1.1",