diff --git a/web-frontend/package-lock.json b/web-frontend/package-lock.json
index 88b76b3b..e6e77d2c 100644
--- a/web-frontend/package-lock.json
+++ b/web-frontend/package-lock.json
@@ -3353,9 +3353,9 @@
       }
     },
     "node_modules/@massalabs/react-ui-kit": {
-      "version": "0.0.5-dev.20240521130643",
-      "resolved": "https://registry.npmjs.org/@massalabs/react-ui-kit/-/react-ui-kit-0.0.5-dev.20240521130643.tgz",
-      "integrity": "sha512-vEmMYwH8mpD/LcATJHiTDYotd0PQPLHyb4hgMfijrd23Zln8ukoRL3fWiXudy9OE0RyLufgLzeEg2V4OHDmWcA==",
+      "version": "0.0.5-dev.20240522140200",
+      "resolved": "https://registry.npmjs.org/@massalabs/react-ui-kit/-/react-ui-kit-0.0.5-dev.20240522140200.tgz",
+      "integrity": "sha512-NQF2P4nOMiWxzHhxkxb8hbIGjcG3xiXLlvTSFSAICWBvRl6BI3q69jrazjD33de6bwHF3C6B3/xUyoKFDvPV1A==",
       "dependencies": {
         "@headlessui/react": "^1.7.15",
         "copy-to-clipboard": "^3.3.3",
diff --git a/web-frontend/src/pages/TransferCoins/SendCoins/SendConfirmation.tsx b/web-frontend/src/pages/TransferCoins/SendCoins/SendConfirmation.tsx
index e7edf453..48cc397a 100644
--- a/web-frontend/src/pages/TransferCoins/SendCoins/SendConfirmation.tsx
+++ b/web-frontend/src/pages/TransferCoins/SendCoins/SendConfirmation.tsx
@@ -108,27 +108,29 @@ export function SendConfirmation(props: SendConfirmationProps) {
             'mr-3',
           )}
         />
-        <div className="flex items-center gap-8 ">
-          <div className="flex items-center">
-            <Tooltip body={content} />
-            <p>{Intl.t('send-coins.fee')}</p>
+        <div className="flex flex-col gap-4 p-4">
+          <div className="flex items-center gap-8">
+            <div className="flex gap-2 items-center">
+              <Tooltip customClass="max-w-[380px] p-2" body={content} />
+              <p>{Intl.t('send-coins.fee')}</p>
+            </div>
+            <Balance amount={fees} symbol="MAS" size="xs" />
           </div>
-          <Balance amount={fees} symbol="MAS" size="xs" />
-        </div>
-        <div
-          data-testid="send-confirmation-recipient"
-          className="text-info flex items-center gap-2"
-        >
-          <div>{Intl.t('send-coins.recipient')}</div>
-          <Clipboard
-            displayedContent={formattedRecipientAddress}
-            rawContent={recipientAddress}
-            error={Intl.t('errors.no-content-to-copy')}
-            className="flex flex-row items-center mas-body2 justify-between
+          <div
+            data-testid="send-confirmation-recipient"
+            className="text-info flex items-center gap-2"
+          >
+            <div>{Intl.t('send-coins.recipient')}</div>
+            <Clipboard
+              displayedContent={formattedRecipientAddress}
+              rawContent={recipientAddress}
+              error={Intl.t('errors.no-content-to-copy')}
+              className="flex flex-row items-center mas-body2 justify-between
               w-fit h-fit px-3 py-1 rounded bg-primary cursor-pointer"
-          />
+            />
+          </div>
+          {recipientDomainName && <Mns mns={recipientDomainName} />}
         </div>
-        {recipientDomainName && <Mns mns={recipientDomainName} />}
       </div>
       <Button disabled={isLoading} onClick={() => handleConfirm(true)}>
         {Intl.t('send-coins.confirm-sign')}