diff --git a/src/frontend/src/lib/components/convert/ConvertAmount.svelte b/src/frontend/src/lib/components/convert/ConvertAmount.svelte
new file mode 100644
index 0000000000..c680fb70f4
--- /dev/null
+++ b/src/frontend/src/lib/components/convert/ConvertAmount.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import ConvertAmountDestination from '$lib/components/convert/ConvertAmountDestination.svelte';
+	import ConvertAmountSource from '$lib/components/convert/ConvertAmountSource.svelte';
+	import IconMoveDown from '$lib/components/icons/lucide/IconMoveDown.svelte';
+	import type { OptionAmount } from '$lib/types/send';
+
+	export let sendAmount: OptionAmount;
+	export let receiveAmount: number | undefined;
+	export let totalFee: bigint | undefined;
+	export let insufficientFunds: boolean;
+	export let insufficientFundsForFee: boolean;
+</script>
+
+<ConvertAmountSource
+	bind:sendAmount
+	bind:insufficientFunds
+	bind:insufficientFundsForFee
+	{totalFee}
+/>
+
+<div class="my-4 flex justify-center">
+	<div class="flex h-12 w-12 items-center justify-center rounded-full bg-secondary">
+		<IconMoveDown />
+	</div>
+</div>
+
+<ConvertAmountDestination bind:receiveAmount {sendAmount} {totalFee} {insufficientFunds} />
diff --git a/src/frontend/src/lib/components/convert/ConvertAmountDestination.svelte b/src/frontend/src/lib/components/convert/ConvertAmountDestination.svelte
index 7a70b4afe5..c75923f9ba 100644
--- a/src/frontend/src/lib/components/convert/ConvertAmountDestination.svelte
+++ b/src/frontend/src/lib/components/convert/ConvertAmountDestination.svelte
@@ -7,10 +7,11 @@
 	import { ZERO } from '$lib/constants/app.constants';
 	import { CONVERT_CONTEXT_KEY, type ConvertContext } from '$lib/stores/convert.store';
 	import { i18n } from '$lib/stores/i18n.store';
+	import type { OptionAmount } from '$lib/types/send';
 	import { formatToken, formatTokenBigintToNumber, formatUSD } from '$lib/utils/format.utils';
 	import { parseToken } from '$lib/utils/parse.utils';
 
-	export let sendAmount: number | undefined = undefined;
+	export let sendAmount: OptionAmount = undefined;
 	export let receiveAmount: number | undefined = undefined;
 	export let insufficientFunds: boolean;
 	export let totalFee: bigint | undefined = undefined;
diff --git a/src/frontend/src/lib/components/convert/ConvertAmountSource.svelte b/src/frontend/src/lib/components/convert/ConvertAmountSource.svelte
index 9dc6bad01a..1134e90dc6 100644
--- a/src/frontend/src/lib/components/convert/ConvertAmountSource.svelte
+++ b/src/frontend/src/lib/components/convert/ConvertAmountSource.svelte
@@ -11,11 +11,12 @@
 	import { CONVERT_CONTEXT_KEY, type ConvertContext } from '$lib/stores/convert.store';
 	import { i18n } from '$lib/stores/i18n.store';
 	import type { ConvertAmountErrorType } from '$lib/types/convert';
+	import type { OptionAmount } from '$lib/types/send';
 	import { validateConvertAmount } from '$lib/utils/convert.utils';
 	import { formatToken, formatUSD } from '$lib/utils/format.utils';
 	import { getMaxTransactionAmount } from '$lib/utils/token.utils';
 
-	export let sendAmount: number | undefined = undefined;
+	export let sendAmount: OptionAmount = undefined;
 	export let totalFee: bigint | undefined;
 	export let insufficientFunds: boolean;
 	export let insufficientFundsForFee: boolean;
@@ -52,7 +53,7 @@
 	let convertAmountUSD: number;
 	$: convertAmountUSD =
 		nonNullish(sendAmount) && nonNullish($sourceTokenExchangeRate)
-			? sendAmount * $sourceTokenExchangeRate
+			? Number(sendAmount) * $sourceTokenExchangeRate
 			: 0;
 </script>
 
diff --git a/src/frontend/src/lib/components/convert/ConvertForm.svelte b/src/frontend/src/lib/components/convert/ConvertForm.svelte
new file mode 100644
index 0000000000..19d272459b
--- /dev/null
+++ b/src/frontend/src/lib/components/convert/ConvertForm.svelte
@@ -0,0 +1,42 @@
+<script lang="ts">
+	import { createEventDispatcher } from 'svelte';
+	import ConvertAmount from '$lib/components/convert/ConvertAmount.svelte';
+	import Button from '$lib/components/ui/Button.svelte';
+	import ButtonGroup from '$lib/components/ui/ButtonGroup.svelte';
+	import ContentWithToolbar from '$lib/components/ui/ContentWithToolbar.svelte';
+	import { i18n } from '$lib/stores/i18n.store';
+	import type { OptionAmount } from '$lib/types/send';
+
+	export let sendAmount: OptionAmount;
+	export let receiveAmount: number | undefined;
+	export let totalFee: bigint | undefined;
+	export let disabled: boolean;
+	export let insufficientFunds: boolean;
+	export let insufficientFundsForFee: boolean;
+
+	const dispatch = createEventDispatcher();
+</script>
+
+<ContentWithToolbar>
+	<ConvertAmount
+		bind:sendAmount
+		bind:receiveAmount
+		bind:insufficientFunds
+		bind:insufficientFundsForFee
+		{totalFee}
+	/>
+
+	<div class="mt-16 pb-5">
+		<slot name="message" />
+
+		<slot name="fee" />
+	</div>
+
+	<ButtonGroup slot="toolbar">
+		<slot name="cancel" />
+
+		<Button {disabled} on:click={() => dispatch('icNext')}>
+			{$i18n.convert.text.review_button}
+		</Button>
+	</ButtonGroup>
+</ContentWithToolbar>