diff --git a/client/src/components/bill-form/bill-form.component.jsx b/client/src/components/bill-form/bill-form.component.jsx
index 8cb3259ce..b5cfb9322 100644
--- a/client/src/components/bill-form/bill-form.component.jsx
+++ b/client/src/components/bill-form/bill-form.component.jsx
@@ -1,6 +1,6 @@
+import { UploadOutlined } from "@ant-design/icons";
 import { useApolloClient } from "@apollo/client";
 import {
-  Button,
   Divider,
   Form,
   Input,
@@ -316,9 +316,21 @@ export function BillFormComponent({
           return e && e.fileList;
         }}
       >
-        <Upload name="logo" beforeUpload={() => false} listType="picture">
-          <Button>Click to upload</Button>
-        </Upload>
+        <Upload.Dragger
+          multiple={true}
+          name="logo"
+          beforeUpload={() => false}
+          listType="picture"
+        >
+          <>
+            <p className="ant-upload-drag-icon">
+              <UploadOutlined />
+            </p>
+            <p className="ant-upload-text">
+              Click or drag files to this area to upload.
+            </p>
+          </>
+        </Upload.Dragger>
       </Form.Item>
     </div>
   );