diff --git a/src/frontend/src/lib/components/canister/top-up/CanisterTopUpFormIcp.svelte b/src/frontend/src/lib/components/canister/top-up/CanisterTopUpFormIcp.svelte
index 68acf7d25..5e5227469 100644
--- a/src/frontend/src/lib/components/canister/top-up/CanisterTopUpFormIcp.svelte
+++ b/src/frontend/src/lib/components/canister/top-up/CanisterTopUpFormIcp.svelte
@@ -7,7 +7,12 @@
 	import Value from '$lib/components/ui/Value.svelte';
 	import { ICP_TOP_UP_FEE } from '$lib/constants/token.constants';
 	import { i18n } from '$lib/stores/app/i18n.store';
-	import { formatTCycles, icpToCycles } from '$lib/utils/cycles.utils';
+	import {
+		formatTCycles,
+		icpE8sToCycles,
+		icpNumberToCycles,
+		icpToCycles
+	} from '$lib/utils/cycles.utils';
 
 	interface Props {
 		balance: bigint;
@@ -26,7 +31,7 @@
 
 	let convertedCycles = $derived(
 		nonNullish(trillionRatio) && !isNaN(Number(amount)) && notEmptyString(amount)
-			? icpToCycles({ icp: BigInt(amount), trillionRatio })
+			? icpNumberToCycles({ icp: Number(amount), trillionRatio })
 			: undefined
 	);
 
@@ -35,6 +40,8 @@
 			? `${formatTCycles(BigInt(convertedCycles ?? 0))}`
 			: undefined;
 	});
+
+	$inspect(amount, displayTCycles, convertedCycles);
 </script>
 
 <div class="group-cycles">
diff --git a/src/frontend/src/lib/utils/cycles.utils.ts b/src/frontend/src/lib/utils/cycles.utils.ts
index b2ae80002..e55ada3d4 100644
--- a/src/frontend/src/lib/utils/cycles.utils.ts
+++ b/src/frontend/src/lib/utils/cycles.utils.ts
@@ -35,6 +35,14 @@ export const icpToCycles = ({
 	trillionRatio: bigint;
 }): bigint => icp * trillionRatio;
 
+export const icpNumberToCycles = ({
+	icp,
+	trillionRatio
+}: {
+	icp: number;
+	trillionRatio: bigint;
+}): bigint => BigInt(Math.trunc(icp * Number(trillionRatio)));
+
 export const formatCyclesToHTML = ({ e12s, bold }: { e12s: bigint; bold: boolean }): string => {
 	const tag = bold ? 'strong' : 'span';
 	return `<${tag}>${formatTCycles(e12s)} <small>T Cycles</small></${tag}>`;