diff --git a/App.css b/App.css
index 150812b1..281ad899 100644
--- a/App.css
+++ b/App.css
@@ -96,7 +96,6 @@ div[data-rk] {
     @apply h-3 !important;
     top: 1.4rem !important;
   }
-
   .btn-vortex-primary {
     @apply bg-blue-700;
     @apply text-white;
@@ -125,6 +124,34 @@ div[data-rk] {
     @apply border-blue-700;
   }
 
+  .btn-vortex-primary-inverse {
+    @apply bg-white;
+    @apply text-blue-700;
+    @apply rounded-xl;
+    @apply border;
+    @apply border-blue-700;
+  }
+
+  .btn-vortex-primary-inverse:hover {
+    @apply bg-blue-700;
+    @apply text-white;
+    @apply border-blue-700;
+  }
+
+  .btn-vortex-primary-inverse:disabled {
+    @apply bg-white;
+    @apply text-blue-700;
+    @apply border-blue-700;
+    @apply opacity-40;
+  }
+
+  .btn-vortex-primary-inverse:active,
+  .btn-vortex-primary-inverse:focus {
+    @apply bg-blue-200;
+    @apply text-blue-700;
+    @apply border-blue-700;
+  }
+
   .btn-vortex-secondary {
     @apply text-white;
     @apply bg-pink-600;
diff --git a/src/pages/swap/index.tsx b/src/pages/swap/index.tsx
index 04ad5bc7..045a9426 100644
--- a/src/pages/swap/index.tsx
+++ b/src/pages/swap/index.tsx
@@ -417,7 +417,7 @@ export const SwapPage = () => {
         </section>
         <div className="flex gap-3 mt-5">
           <button
-            className="btn-vortex-secondary btn"
+            className="btn-vortex-primary-inverse btn"
             style={{ flex: '1 1 calc(50% - 0.75rem/2)' }}
             disabled={!inputAmountIsStable}
             onClick={(e) => {