diff --git a/apps/app/components/ui/multi-input.tsx b/apps/app/components/ui/multi-input.tsx
index c27a900e8..e9890564d 100644
--- a/apps/app/components/ui/multi-input.tsx
+++ b/apps/app/components/ui/multi-input.tsx
@@ -56,7 +56,11 @@ export const MultiInput = ({ label, name, placeholder, setValue, watch }: any) =
       {label && <label className="mb-2 text-brand-secondary">{label}</label>}
       <div className="rounded-md border border-brand-base p-2">
         {watch(name)?.map((tag: any, index: number) => (
-          <button type="button" className="m-1.5 rounded-full bg-slate-300 p-1.5" key={index}>
+          <button
+            type="button"
+            className="m-1.5 rounded-full bg-brand-surface-2 px-3 py-2 "
+            key={index}
+          >
             {tag.email} <span onClick={() => removeTag(index)}>&times;</span>
           </button>
         ))}