diff --git a/src/app/(mobile-ui)/profile/exchange-rate/page.tsx b/src/app/(mobile-ui)/profile/exchange-rate/page.tsx
new file mode 100644
index 000000000..f1ec7be9d
--- /dev/null
+++ b/src/app/(mobile-ui)/profile/exchange-rate/page.tsx
@@ -0,0 +1,23 @@
+'use client'
+
+import PageContainer from '@/components/0_Bruddle/PageContainer'
+import ExchangeRateWidget from '@/components/Global/ExchangeRateWidget'
+import NavHeader from '@/components/Global/NavHeader'
+import { useRouter } from 'next/navigation'
+
+export default function ExchangeRatePage() {
+    const router = useRouter()
+
+    return (
+        <PageContainer className="flex flex-col">
+            <NavHeader title="Exchange rate & fees" onPrev={() => router.replace('/profile')} />
+            <div className="m-auto">
+                <ExchangeRateWidget
+                    ctaIcon="arrow-down"
+                    ctaLabel="Add money to try it"
+                    ctaAction={() => router.push('/add-money')}
+                />
+            </div>
+        </PageContainer>
+    )
+}
diff --git a/src/components/Global/ExchangeRateWidget/index.tsx b/src/components/Global/ExchangeRateWidget/index.tsx
new file mode 100644
index 000000000..37d907c6b
--- /dev/null
+++ b/src/components/Global/ExchangeRateWidget/index.tsx
@@ -0,0 +1,236 @@
+import CurrencySelect from '@/components/LandingPage/CurrencySelect'
+import { countryCurrencyMappings } from '@/constants/countryCurrencyMapping'
+import { useDebounce } from '@/hooks/useDebounce'
+import { useExchangeRate } from '@/hooks/useExchangeRate'
+import Image from 'next/image'
+import { useRouter, useSearchParams } from 'next/navigation'
+import { FC, useCallback, useEffect, useMemo } from 'react'
+import { Icon, IconName } from '../Icons/Icon'
+import { Button } from '@/components/0_Bruddle'
+
+interface IExchangeRateWidgetProps {
+    ctaLabel: string
+    ctaIcon: IconName
+    ctaAction: () => void
+}
+
+const ExchangeRateWidget: FC<IExchangeRateWidgetProps> = ({ ctaLabel, ctaIcon, ctaAction }) => {
+    const searchParams = useSearchParams()
+    const router = useRouter()
+
+    // Get values from URL or use defaults
+    const sourceCurrency = searchParams.get('from') || 'USD'
+    const destinationCurrency = searchParams.get('to') || 'EUR'
+    const rawAmount = searchParams.get('amount')
+    const parsedAmount = rawAmount !== null ? Number(rawAmount) : 10
+    const urlSourceAmount = Number.isFinite(parsedAmount) && parsedAmount > 0 ? parsedAmount : 10
+
+    // Exchange rate hook handles all the conversion logic
+    const {
+        sourceAmount,
+        destinationAmount,
+        exchangeRate,
+        isLoading,
+        isError,
+        handleSourceAmountChange,
+        handleDestinationAmountChange,
+        getDestinationDisplayValue,
+    } = useExchangeRate({
+        sourceCurrency,
+        destinationCurrency,
+        initialSourceAmount: urlSourceAmount,
+    })
+
+    const debouncedSourceAmount = useDebounce(sourceAmount, 500)
+
+    // Function to update URL parameters
+    const updateUrlParams = useCallback(
+        (params: { from?: string; to?: string; amount?: number }) => {
+            const newSearchParams = new URLSearchParams(searchParams.toString())
+
+            if (params.from) newSearchParams.set('from', params.from)
+            if (params.to) newSearchParams.set('to', params.to)
+            if (params.amount !== undefined) newSearchParams.set('amount', params.amount.toString())
+
+            router.replace(`?${newSearchParams.toString()}`, { scroll: false })
+        },
+        [searchParams, router]
+    )
+
+    // Setter functions that update URL
+    const setSourceCurrency = useCallback(
+        (currency: string) => {
+            updateUrlParams({ from: currency })
+        },
+        [updateUrlParams]
+    )
+
+    const setDestinationCurrency = useCallback(
+        (currency: string) => {
+            updateUrlParams({ to: currency })
+        },
+        [updateUrlParams]
+    )
+
+    // Update URL when source amount changes (only for valid numbers)
+    useEffect(() => {
+        if (typeof debouncedSourceAmount === 'number' && debouncedSourceAmount !== urlSourceAmount) {
+            updateUrlParams({ amount: debouncedSourceAmount })
+        }
+    }, [debouncedSourceAmount, urlSourceAmount, updateUrlParams])
+
+    const sourceCurrencyFlag = useMemo(
+        () => countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.flagCode,
+        [sourceCurrency]
+    )
+
+    const destinationCurrencyFlag = useMemo(
+        () => countryCurrencyMappings.find((currency) => currency.currencyCode === destinationCurrency)?.flagCode,
+        [destinationCurrency]
+    )
+
+    // Determine delivery time text based on destination currency
+    const deliveryTimeText = useMemo(() => {
+        return destinationCurrency === 'USD'
+            ? 'Should arrive in hours. Estimate.'
+            : 'Should arrive in minutes. Estimate.'
+    }, [destinationCurrency])
+
+    return (
+        <div className="btn btn-shadow-primary-4 mx-auto mt-12 flex h-fit w-full flex-col items-center justify-center gap-4 bg-white p-7 md:w-[420px]">
+            <div className="w-full">
+                <h2 className="text-left text-sm">You Send</h2>
+                <div className="btn btn-shadow-primary-4 mt-2 flex w-full items-center justify-center gap-4 bg-white p-4">
+                    {isLoading ? (
+                        <div className="flex w-full items-center">
+                            <div className="h-8 w-40 animate-pulse rounded-full bg-grey-2" />
+                        </div>
+                    ) : (
+                        <input
+                            min={0}
+                            placeholder="0"
+                            value={sourceAmount === '' ? '' : sourceAmount}
+                            onChange={(e) => {
+                                const inputValue = e.target.value
+                                if (inputValue === '') {
+                                    handleSourceAmountChange('')
+                                } else {
+                                    const value = parseFloat(inputValue)
+                                    handleSourceAmountChange(isNaN(value) ? '' : value)
+                                }
+                            }}
+                            type="number"
+                            className="w-full bg-transparent outline-none"
+                        />
+                    )}
+                    <CurrencySelect
+                        selectedCurrency={sourceCurrency}
+                        setSelectedCurrency={setSourceCurrency}
+                        // excludeCurrencies={[destinationCurrency]}
+                        trigger={
+                            <button className="flex w-32 items-center gap-2">
+                                <Image
+                                    src={`https://flagcdn.com/w320/${sourceCurrencyFlag}.png`}
+                                    alt={`${sourceCurrencyFlag} flag`}
+                                    width={160}
+                                    height={160}
+                                    className="size-4 rounded-full object-cover"
+                                />
+                                {sourceCurrency} <Icon name="chevron-down" className="text-gray-1" size={10} />
+                            </button>
+                        }
+                    />
+                </div>
+            </div>
+
+            <div className="w-full">
+                <h2 className="text-left text-sm">Recipient Gets</h2>
+                <div className="btn btn-shadow-primary-4 mt-2 flex w-full items-center justify-center gap-4 bg-white p-4">
+                    {isLoading ? (
+                        <div className="flex w-full items-center">
+                            <div className="h-8 w-40 animate-pulse rounded-full bg-grey-2" />
+                        </div>
+                    ) : (
+                        <input
+                            min={0}
+                            placeholder="0"
+                            value={getDestinationDisplayValue()}
+                            onChange={(e) => {
+                                const inputValue = e.target.value
+                                if (inputValue === '') {
+                                    handleDestinationAmountChange('', '')
+                                } else {
+                                    const value = parseFloat(inputValue)
+                                    handleDestinationAmountChange(inputValue, isNaN(value) ? '' : value)
+                                }
+                            }}
+                            type="number"
+                            className="w-full bg-transparent outline-none"
+                        />
+                    )}
+                    <CurrencySelect
+                        selectedCurrency={destinationCurrency}
+                        setSelectedCurrency={setDestinationCurrency}
+                        trigger={
+                            <button className="flex w-32 items-center gap-2">
+                                <Image
+                                    src={`https://flagcdn.com/w320/${destinationCurrencyFlag}.png`}
+                                    alt={`${destinationCurrencyFlag} flag`}
+                                    width={160}
+                                    height={160}
+                                    className="size-4 rounded-full object-cover"
+                                />
+                                {destinationCurrency} <Icon name="chevron-down" className="text-gray-1" size={10} />
+                            </button>
+                        }
+                    />
+                </div>
+            </div>
+
+            <div className="rounded-full bg-grey-4 px-2 py-[2px] text-xs font-bold text-gray-1">
+                {isLoading ? (
+                    <div className="mx-auto h-3 w-28 animate-pulse rounded-full bg-grey-2" />
+                ) : isError ? (
+                    <span>Rate currently unavailable</span>
+                ) : (
+                    <>
+                        1 {sourceCurrency} = {exchangeRate.toFixed(4)} {destinationCurrency}
+                    </>
+                )}
+            </div>
+
+            {typeof destinationAmount === 'number' && destinationAmount > 0 && (
+                <div className="flex w-full flex-col gap-3 rounded-sm border-[1.15px] border-black px-4 py-2">
+                    <div className="flex items-center justify-between">
+                        <h2 className="text-left text-sm font-normal">Bank fee</h2>
+                        <h2 className="text-left text-sm font-normal">Free!</h2>
+                    </div>
+
+                    <div className="flex items-center justify-between">
+                        <h2 className="text-left text-sm font-normal">Peanut fee</h2>
+                        <h2 className="text-left text-sm font-normal">Free!</h2>
+                    </div>
+                </div>
+            )}
+
+            <Button
+                onClick={ctaAction}
+                icon={ctaIcon}
+                iconSize={13}
+                shadowSize="4"
+                className="w-full text-base font-bold"
+            >
+                {ctaLabel}
+            </Button>
+
+            {typeof destinationAmount === 'number' && destinationAmount > 0 && (
+                <div className="flex items-center">
+                    <Icon name="info" className="text-gray-1" size={10} />
+                    <p className="text-xs text-gray-1">{deliveryTimeText}</p>
+                </div>
+            )}
+        </div>
+    )
+}
+
+export default ExchangeRateWidget
diff --git a/src/components/LandingPage/noFees.tsx b/src/components/LandingPage/noFees.tsx
index 2744e27ae..6789b4083 100644
--- a/src/components/LandingPage/noFees.tsx
+++ b/src/components/LandingPage/noFees.tsx
@@ -1,83 +1,17 @@
 'use client'
 
-import React, { useEffect, useState, useCallback, useMemo } from 'react'
+import React, { useEffect, useState } from 'react'
 import { motion } from 'framer-motion'
 import borderCloud from '@/assets/illustrations/border-cloud.svg'
 import noHiddenFees from '@/assets/illustrations/no-hidden-fees.svg'
 import { Star } from '@/assets'
 import Image from 'next/image'
-import { Button } from '../0_Bruddle'
-import CurrencySelect from './CurrencySelect'
-import { Icon } from '../Global/Icons/Icon'
-import { useDebounce } from '@/hooks/useDebounce'
-import { useExchangeRate } from '@/hooks/useExchangeRate'
-import { useSearchParams, useRouter } from 'next/navigation'
-import countryCurrencyMappings from '@/constants/countryCurrencyMapping'
+import ExchangeRateWidget from '../Global/ExchangeRateWidget'
+import { useRouter } from 'next/navigation'
 
 export function NoFees() {
-    const searchParams = useSearchParams()
-    const router = useRouter()
-
     const [screenWidth, setScreenWidth] = useState(typeof window !== 'undefined' ? window.innerWidth : 1200)
-
-    // Get values from URL or use defaults
-    const sourceCurrency = searchParams.get('from') || 'USD'
-    const destinationCurrency = searchParams.get('to') || 'EUR'
-    const urlSourceAmount = searchParams.get('amount') ? parseFloat(searchParams.get('amount')!) : 10
-
-    // Exchange rate hook handles all the conversion logic
-    const {
-        sourceAmount,
-        destinationAmount,
-        exchangeRate,
-        isLoading,
-        isError,
-        handleSourceAmountChange,
-        handleDestinationAmountChange,
-        getDestinationDisplayValue,
-    } = useExchangeRate({
-        sourceCurrency,
-        destinationCurrency,
-        initialSourceAmount: urlSourceAmount,
-    })
-
-    const debouncedSourceAmount = useDebounce(sourceAmount, 500)
-
-    // Function to update URL parameters
-    const updateUrlParams = useCallback(
-        (params: { from?: string; to?: string; amount?: number }) => {
-            const newSearchParams = new URLSearchParams(searchParams.toString())
-
-            if (params.from) newSearchParams.set('from', params.from)
-            if (params.to) newSearchParams.set('to', params.to)
-            if (params.amount !== undefined) newSearchParams.set('amount', params.amount.toString())
-
-            router.replace(`?${newSearchParams.toString()}`, { scroll: false })
-        },
-        [searchParams, router]
-    )
-
-    // Setter functions that update URL
-    const setSourceCurrency = useCallback(
-        (currency: string) => {
-            updateUrlParams({ from: currency })
-        },
-        [updateUrlParams]
-    )
-
-    const setDestinationCurrency = useCallback(
-        (currency: string) => {
-            updateUrlParams({ to: currency })
-        },
-        [updateUrlParams]
-    )
-
-    // Update URL when source amount changes (only for valid numbers)
-    useEffect(() => {
-        if (typeof debouncedSourceAmount === 'number' && debouncedSourceAmount !== urlSourceAmount) {
-            updateUrlParams({ amount: debouncedSourceAmount })
-        }
-    }, [debouncedSourceAmount, urlSourceAmount, updateUrlParams])
+    const router = useRouter()
 
     useEffect(() => {
         const handleResize = () => {
@@ -104,23 +38,6 @@ export function NoFees() {
         }
     }
 
-    const sourceCurrencyFlag = useMemo(
-        () => countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.flagCode,
-        [sourceCurrency]
-    )
-
-    const destinationCurrencyFlag = useMemo(
-        () => countryCurrencyMappings.find((currency) => currency.currencyCode === destinationCurrency)?.flagCode,
-        [destinationCurrency]
-    )
-
-    // Determine delivery time text based on destination currency
-    const deliveryTimeText = useMemo(() => {
-        return destinationCurrency === 'USD'
-            ? 'Should arrive in hours. Estimate.'
-            : 'Should arrive in minutes. Estimate.'
-    }, [destinationCurrency])
-
     return (
         <section className="relative overflow-hidden bg-secondary-3 px-4 py-24 md:py-14">
             <div className="absolute left-0 top-0 h-full w-full overflow-hidden">
@@ -207,140 +124,11 @@ export function NoFees() {
                     />
                 </div>
 
-                <div className="btn btn-shadow-primary-4 mx-auto mt-12 flex h-fit w-full flex-col items-center justify-center gap-4 bg-white p-7 md:w-[420px]">
-                    <div className="w-full">
-                        <h2 className="text-left text-sm">You Send</h2>
-                        <div className="btn btn-shadow-primary-4 mt-2 flex w-full items-center justify-center gap-4 bg-white p-4">
-                            {isLoading ? (
-                                <div className="flex w-full items-center">
-                                    <div className="h-8 w-40 animate-pulse rounded-full bg-grey-2" />
-                                </div>
-                            ) : (
-                                <input
-                                    min={0}
-                                    placeholder="0"
-                                    value={sourceAmount === '' ? '' : sourceAmount}
-                                    onChange={(e) => {
-                                        const inputValue = e.target.value
-                                        if (inputValue === '') {
-                                            handleSourceAmountChange('')
-                                        } else {
-                                            const value = parseFloat(inputValue)
-                                            handleSourceAmountChange(isNaN(value) ? '' : value)
-                                        }
-                                    }}
-                                    type="number"
-                                    className="w-full bg-transparent outline-none"
-                                />
-                            )}
-                            <CurrencySelect
-                                selectedCurrency={sourceCurrency}
-                                setSelectedCurrency={setSourceCurrency}
-                                // excludeCurrencies={[destinationCurrency]}
-                                trigger={
-                                    <button className="flex w-32 items-center gap-2">
-                                        <Image
-                                            src={`https://flagcdn.com/w320/${sourceCurrencyFlag}.png`}
-                                            alt={`${sourceCurrencyFlag} flag`}
-                                            width={160}
-                                            height={160}
-                                            className="size-4 rounded-full object-cover"
-                                        />
-                                        {sourceCurrency} <Icon name="chevron-down" className="text-gray-1" size={10} />
-                                    </button>
-                                }
-                            />
-                        </div>
-                    </div>
-
-                    <div className="w-full">
-                        <h2 className="text-left text-sm">Recipient Gets</h2>
-                        <div className="btn btn-shadow-primary-4 mt-2 flex w-full items-center justify-center gap-4 bg-white p-4">
-                            {isLoading ? (
-                                <div className="flex w-full items-center">
-                                    <div className="h-8 w-40 animate-pulse rounded-full bg-grey-2" />
-                                </div>
-                            ) : (
-                                <input
-                                    min={0}
-                                    placeholder="0"
-                                    value={getDestinationDisplayValue()}
-                                    onChange={(e) => {
-                                        const inputValue = e.target.value
-                                        if (inputValue === '') {
-                                            handleDestinationAmountChange('', '')
-                                        } else {
-                                            const value = parseFloat(inputValue)
-                                            handleDestinationAmountChange(inputValue, isNaN(value) ? '' : value)
-                                        }
-                                    }}
-                                    type="number"
-                                    className="w-full bg-transparent outline-none"
-                                />
-                            )}
-                            <CurrencySelect
-                                selectedCurrency={destinationCurrency}
-                                setSelectedCurrency={setDestinationCurrency}
-                                trigger={
-                                    <button className="flex w-32 items-center gap-2">
-                                        <Image
-                                            src={`https://flagcdn.com/w320/${destinationCurrencyFlag}.png`}
-                                            alt={`${destinationCurrencyFlag} flag`}
-                                            width={160}
-                                            height={160}
-                                            className="size-4 rounded-full object-cover"
-                                        />
-                                        {destinationCurrency}{' '}
-                                        <Icon name="chevron-down" className="text-gray-1" size={10} />
-                                    </button>
-                                }
-                            />
-                        </div>
-                    </div>
-
-                    <div className="rounded-full bg-grey-4 px-2 py-[2px] text-xs font-bold text-gray-1">
-                        {isLoading ? (
-                            <div className="mx-auto h-3 w-28 animate-pulse rounded-full bg-grey-2" />
-                        ) : isError ? (
-                            <span>Rate currently unavailable</span>
-                        ) : (
-                            <>
-                                1 {sourceCurrency} = {exchangeRate.toFixed(4)} {destinationCurrency}
-                            </>
-                        )}
-                    </div>
-
-                    {typeof destinationAmount === 'number' && destinationAmount > 0 && (
-                        <div className="flex w-full flex-col gap-3 rounded-sm border-[1.15px] border-black px-4 py-2">
-                            <div className="flex items-center justify-between">
-                                <h2 className="text-left text-sm font-normal">Bank fee</h2>
-                                <h2 className="text-left text-sm font-normal">Free!</h2>
-                            </div>
-
-                            <div className="flex items-center justify-between">
-                                <h2 className="text-left text-sm font-normal">Peanut fee</h2>
-                                <h2 className="text-left text-sm font-normal">Free!</h2>
-                            </div>
-                        </div>
-                    )}
-
-                    <Button
-                        onClick={() => router.push('/setup')}
-                        icon="arrow-up-right"
-                        iconSize={13}
-                        shadowSize="4"
-                        className="w-full text-base font-bold"
-                    >
-                        Send Money
-                    </Button>
-
-                    {typeof destinationAmount === 'number' && destinationAmount > 0 && (
-                        <div className="flex items-center">
-                            <Icon name="info" className="text-gray-1" size={10} />
-                            <p className="text-xs text-gray-1">{deliveryTimeText}</p>
-                        </div>
-                    )}
-                </div>
+                <ExchangeRateWidget
+                    ctaIcon="arrow-up-right"
+                    ctaLabel="Send Money"
+                    ctaAction={() => router.push('/setup')}
+                />
             </div>
         </section>
     )
diff --git a/src/components/Profile/index.tsx b/src/components/Profile/index.tsx
index 9f9bafe80..c988eef83 100644
--- a/src/components/Profile/index.tsx
+++ b/src/components/Profile/index.tsx
@@ -44,13 +44,14 @@ export const Profile = () => {
                 <ProfileHeader name={fullName || username} username={username} isVerified={isKycApproved} />
                 <div className="space-y-4">
                     {/* Menu Item - Invite Entry */}
-                    <ProfileMenuItem
+                    {/* Enable with Invites project. */}
+                    {/* <ProfileMenuItem
                         icon="smile"
                         label="Invite friends to Peanut"
                         href="https://docs.peanut.to/how-to-use-peanut-links/referrals"
                         position="single"
                         isExternalLink
-                    />
+                    /> */}
                     {/* Menu Items - First Group */}
                     <div>
                         <ProfileMenuItem icon="user" label="Personal details" href="/profile/edit" position="first" />
@@ -91,10 +92,9 @@ export const Profile = () => {
                         <ProfileMenuItem icon="currency" label="Currency" position="middle" comingSoon />
                         <ProfileMenuItem
                             icon="exchange"
-                            label="Exchange rates"
-                            href="/profile/exchange-rates"
+                            label="Exchange rates and fees"
+                            href="/profile/exchange-rate"
                             position="last"
-                            comingSoon
                         />
                     </div>
                     {/* Logout Button */}