diff --git a/src/leapfrogai_ui/src/lib/components/ChatFileUpload.svelte b/src/leapfrogai_ui/src/lib/components/ChatFileUpload.svelte
index 7f65dd298..71b4846c0 100644
--- a/src/leapfrogai_ui/src/lib/components/ChatFileUpload.svelte
+++ b/src/leapfrogai_ui/src/lib/components/ChatFileUpload.svelte
@@ -114,6 +114,7 @@
   bind:ref={fileUploadBtnRef}
   testId="upload-file-btn"
   name="files"
+  unstyled
   outline
   multiple
   size="sm"
diff --git a/src/leapfrogai_ui/src/lib/components/LFFileUploadBtn.svelte b/src/leapfrogai_ui/src/lib/components/LFFileUploadBtn.svelte
index 774f6257c..115b2c1cb 100644
--- a/src/leapfrogai_ui/src/lib/components/LFFileUploadBtn.svelte
+++ b/src/leapfrogai_ui/src/lib/components/LFFileUploadBtn.svelte
@@ -13,6 +13,7 @@
   export let outline: boolean = false;
   export let testId: string | null = null; // for the button element
   export let btnColor = 'primary';
+  export let unstyled = false;
 
   const dispatch = createEventDispatcher();
 </script>
@@ -37,17 +38,30 @@
     {...$$restProps}
     class="sr-only"
   />
-  <Button
-    data-testid={testId}
-    color={btnColor}
-    {outline}
-    {size}
-    {disabled}
-    on:click={() => ref?.click()}
-    class={twMerge('w-full', $$props.class)}
-  >
-    <div class="flex w-full justify-between">
-      <slot />
-    </div>
-  </Button>
+  {#if unstyled}
+    <button
+      data-testid={testId}
+      {disabled}
+      on:click={() => ref?.click()}
+      class={twMerge('w-full', $$props.class)}
+    >
+      <div class="flex w-full justify-between">
+        <slot />
+      </div>
+    </button>
+  {:else}
+    <Button
+      data-testid={testId}
+      color={btnColor}
+      {outline}
+      {size}
+      {disabled}
+      on:click={() => ref?.click()}
+      class={twMerge('w-full', $$props.class)}
+    >
+      <div class="flex w-full justify-between">
+        <slot />
+      </div>
+    </Button>
+  {/if}
 </div>