diff --git a/src/lib/components/account/sendVerificationEmailModal.svelte b/src/lib/components/account/sendVerificationEmailModal.svelte
index 1ad53ed1bb..100ff63090 100644
--- a/src/lib/components/account/sendVerificationEmailModal.svelte
+++ b/src/lib/components/account/sendVerificationEmailModal.svelte
@@ -9,10 +9,9 @@
     import Link from '$lib/elements/link.svelte';
     import { Card, Layout, Typography } from '@appwrite.io/pink-svelte';
     import { Dependencies } from '$lib/constants';
-    import { onMount, onDestroy } from 'svelte';
+    import { onDestroy } from 'svelte';
     import { resolve } from '$app/paths';
-    import { browser } from '$app/environment';
-    import { slide } from 'svelte/transition';
+    import ResendCooldown from '$lib/components/resendCooldown.svelte';
 
     let {
         show = $bindable(false),
@@ -25,8 +24,6 @@
     let error = $state(null);
     let creating = $state(false);
     let emailSent = $state(false);
-    let resendTimer = $state(0);
-    let timerInterval: ReturnType<typeof setInterval> | null = null;
 
     async function logout() {
         error = null;
@@ -41,72 +38,15 @@
 
     const cleanUrl = $derived(page.url.origin + page.url.pathname);
 
-    // manage resend timer in localStorage
-    const EMAIL_SENT_KEY = 'email_verification_sent';
-    const TIMER_END_KEY = 'email_verification_timer_end';
-
-    function startResendTimer() {
-        resendTimer = 60;
-        emailSent = true;
-        const timerEndTime = Date.now() + 60 * 1000;
-
-        if (browser) {
-            localStorage.setItem(EMAIL_SENT_KEY, 'true');
-            localStorage.setItem(TIMER_END_KEY, timerEndTime.toString());
-        }
-
-        startTimerCountdown(timerEndTime);
-    }
-
-    function restoreTimerState() {
-        if (!browser) return;
-        const savedTimerEnd = localStorage.getItem(TIMER_END_KEY);
-        const savedEmailSent = localStorage.getItem(EMAIL_SENT_KEY);
-
-        if (savedTimerEnd && savedEmailSent) {
-            const timerEndTime = parseInt(savedTimerEnd);
-            const now = Date.now();
-            const remainingTime = Math.max(0, Math.ceil((timerEndTime - now) / 1000));
-
-            if (remainingTime > 0) {
-                resendTimer = remainingTime;
-                emailSent = true;
-                startTimerCountdown(timerEndTime);
-            } else {
-                // timer has expired, clean up
-                localStorage.removeItem(TIMER_END_KEY);
-                localStorage.removeItem(EMAIL_SENT_KEY);
-
-                resendTimer = 0;
-                emailSent = false;
-            }
-        }
-    }
-
-    function startTimerCountdown(timerEndTime: number) {
-        timerInterval = setInterval(() => {
-            const now = Date.now();
-            const remainingTime = Math.max(0, Math.ceil((timerEndTime - now) / 1000));
-            resendTimer = remainingTime;
-            if (remainingTime <= 0) {
-                clearInterval(timerInterval);
-                timerInterval = null;
-                if (browser) {
-                    localStorage.removeItem(TIMER_END_KEY);
-                    localStorage.removeItem(EMAIL_SENT_KEY);
-                }
-            }
-        }, 1000);
-    }
+    // Timer UI handled by ResendCooldown component
 
     async function onSubmit() {
-        if (creating || resendTimer > 0) return;
+        if (creating) return;
         error = null;
         creating = true;
         try {
             await sdk.forConsole.account.createVerification({ url: cleanUrl });
             emailSent = true;
-            startResendTimer();
         } catch (err) {
             error = err.message;
         } finally {
@@ -114,18 +54,7 @@
         }
     }
 
-    onMount(restoreTimerState);
-
-    onDestroy(() => {
-        if (timerInterval) {
-            clearInterval(timerInterval);
-        }
-
-        if (browser) {
-            localStorage.removeItem(TIMER_END_KEY);
-            localStorage.removeItem(EMAIL_SENT_KEY);
-        }
-    });
+    onDestroy(() => {});
 </script>
 
 <div class="email-verification-scrim">
@@ -147,27 +76,21 @@
                 </Typography.Text>
 
                 <Link variant="default" on:click={() => logout()}>Switch account</Link>
-
-                {#if emailSent && resendTimer > 0}
-                    <div transition:slide={{ duration: 150 }}>
-                        <Typography.Text
-                            color="neutral-secondary"
-                            style="margin-block-start: var(--gap-L, 16px);">
-                            Didn't get the email? Try again in {resendTimer}s
-                        </Typography.Text>
-                    </div>
-                {/if}
             </Layout.Stack>
         </Card.Base>
 
         <svelte:fragment slot="footer">
-            <Button
-                submit
-                submissionLoader
-                forceShowLoader={creating}
-                disabled={creating || resendTimer > 0}>
-                {emailSent ? 'Resend email' : 'Send email'}
-            </Button>
+            {#if emailSent}
+                <ResendCooldown
+                    storageKey="email_verification_resend"
+                    seconds={60}
+                    bind:disabled={creating}
+                    onResend={onSubmit} />
+            {:else}
+                <Button submit submissionLoader forceShowLoader={creating} disabled={creating}>
+                    Send email
+                </Button>
+            {/if}
         </svelte:fragment>
     </Modal>
 </div>
diff --git a/src/lib/components/resendCooldown.svelte b/src/lib/components/resendCooldown.svelte
new file mode 100644
index 0000000000..f390f06648
--- /dev/null
+++ b/src/lib/components/resendCooldown.svelte
@@ -0,0 +1,83 @@
+<script lang="ts">
+    import { browser } from '$app/environment';
+    import { onMount, onDestroy } from 'svelte';
+    import { Link } from '@appwrite.io/pink-svelte';
+
+    let {
+        storageKey = 'resend_cooldown_default',
+        seconds = 60,
+        disabled = $bindable(false),
+        onResend
+    }: {
+        storageKey?: string;
+        seconds?: number;
+        disabled?: boolean;
+        onResend: () => Promise<void> | void;
+    } = $props();
+
+    let remaining = $state(0);
+    let interval: ReturnType<typeof setInterval> | null = null;
+
+    function start(now = Date.now()) {
+        const end = now + seconds * 1000;
+        if (browser) {
+            localStorage.setItem(`${storageKey}:end`, String(end));
+        }
+        tick(end);
+        startTick(end);
+    }
+
+    function restore() {
+        if (!browser) return;
+        const raw = localStorage.getItem(`${storageKey}:end`);
+        if (!raw) return;
+        const end = parseInt(raw);
+        const now = Date.now();
+        const rem = Math.max(0, Math.ceil((end - now) / 1000));
+        if (rem > 0) {
+            remaining = rem;
+            startTick(end);
+        } else {
+            localStorage.removeItem(`${storageKey}:end`);
+            remaining = 0;
+        }
+    }
+
+    function tick(end: number) {
+        const now = Date.now();
+        remaining = Math.max(0, Math.ceil((end - now) / 1000));
+        if (remaining === 0 && browser) {
+            localStorage.removeItem(`${storageKey}:end`);
+        }
+    }
+
+    function startTick(end: number) {
+        clearTick();
+        interval = setInterval(() => {
+            tick(end);
+            if (remaining === 0) clearTick();
+        }, 1000);
+    }
+
+    function clearTick() {
+        if (interval) {
+            clearInterval(interval);
+            interval = null;
+        }
+    }
+
+    async function handleResend() {
+        if (disabled || remaining > 0) return;
+        await onResend?.();
+        start();
+    }
+
+    onMount(restore);
+    onDestroy(() => clearTick());
+</script>
+
+{#if remaining > 0}
+    Try again in {remaining}s
+{:else}
+    <Link.Button on:click={handleResend} {disabled}>Resend code</Link.Button>
+{/if}
diff --git a/src/routes/(public)/(guest)/login/+page.svelte b/src/routes/(public)/(guest)/login/+page.svelte
index e9f8f25b4d..1efc26447e 100644
--- a/src/routes/(public)/(guest)/login/+page.svelte
+++ b/src/routes/(public)/(guest)/login/+page.svelte
@@ -15,9 +15,33 @@
     import { Layout } from '@appwrite.io/pink-svelte';
 
     let mail: string, pass: string, disabled: boolean;
+    let showPasswordLogin: boolean = false;
 
     export let data;
 
+    $: showPasswordLogin = pass && pass.length > 0;
+
+    async function sendSignInCode() {
+        try {
+            disabled = true;
+            // use createEmailToken for sign in with code
+            const sessionToken = await sdk.forConsole.account.createEmailToken({
+                userId: 'unique',
+                email: mail
+            });
+
+            await goto(
+                `${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}`
+            );
+        } catch (error) {
+            disabled = false;
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        }
+    }
+
     async function login() {
         try {
             disabled = true;
@@ -52,7 +76,6 @@
                 return;
             }
 
-            // no specific redirect, so redirect will happen through invalidating the account
             await invalidate(Dependencies.ACCOUNT);
         } catch (error) {
             disabled = false;
@@ -92,22 +115,27 @@
 <Unauthenticated coupon={data?.couponData} campaign={data?.campaign}>
     <svelte:fragment slot="title">Sign in</svelte:fragment>
     <svelte:fragment>
-        <Form onSubmit={login}>
+        <Form onSubmit={showPasswordLogin ? login : sendSignInCode}>
             <Layout.Stack>
                 <InputEmail
                     id="email"
                     label="Email"
                     placeholder="Email"
-                    autofocus={true}
                     required={true}
                     bind:value={mail} />
                 <InputPassword
                     id="password"
                     label="Password"
                     placeholder="Password"
-                    required={true}
+                    required={false}
                     bind:value={pass} />
-                <Button fullWidth submit {disabled}>Sign in</Button>
+
+                {#if showPasswordLogin}
+                    <Button fullWidth submit {disabled}>Sign in</Button>
+                {:else}
+                    <Button fullWidth submit {disabled}>Get sign in code</Button>
+                {/if}
+
                 {#if isCloud}
                     <span class="with-separators eyebrow-heading-3">or</span>
                     <Button secondary fullWidth on:click={onGithubLogin} {disabled}>
diff --git a/src/routes/(public)/(guest)/login/email-otp/+page.svelte b/src/routes/(public)/(guest)/login/email-otp/+page.svelte
new file mode 100644
index 0000000000..50048c67f6
--- /dev/null
+++ b/src/routes/(public)/(guest)/login/email-otp/+page.svelte
@@ -0,0 +1,122 @@
+<script lang="ts">
+    import { goto, invalidate } from '$app/navigation';
+    import { base } from '$app/paths';
+    import { InputDigits, Button } from '$lib/elements/forms';
+    import { addNotification } from '$lib/stores/notifications';
+    import { sdk } from '$lib/stores/sdk';
+    import { Unauthenticated } from '$lib/layout';
+    import { Dependencies } from '$lib/constants';
+    import { Submit, trackEvent, trackError } from '$lib/actions/analytics';
+    import { redirectTo } from '$routes/store';
+    import { user } from '$lib/stores/user';
+    import { Layout, Typography } from '@appwrite.io/pink-svelte';
+    import { page } from '$app/state';
+    import ResendCooldown from '$lib/components/resendCooldown.svelte';
+
+    let otpCode: string = '';
+    let disabled: boolean = false;
+    let email: string = '';
+    let userId: string = '';
+
+    export let data;
+
+    // Get email and userId from URL params
+    $: email = page.url.searchParams.get('email') || '';
+    $: userId = page.url.searchParams.get('userId') || '';
+
+    async function verifyOTP() {
+        try {
+            disabled = true;
+            // Use createSession with the userId from createEmailToken
+            await sdk.forConsole.account.createSession({ userId: userId, secret: otpCode });
+
+            if ($user) {
+                trackEvent(Submit.AccountLogin, { mfa_used: 'none' });
+                addNotification({
+                    type: 'success',
+                    message: 'Successfully logged in.'
+                });
+            }
+
+            if (data?.couponData?.code) {
+                trackEvent(Submit.AccountCreate, {
+                    campaign_name: data?.couponData?.code,
+                    email: email,
+                    name: $user?.name
+                });
+                await goto(`${base}/apply-credit?code=${data?.couponData?.code}`);
+                return;
+            }
+            if (data?.campaign?.$id) {
+                await goto(`${base}/apply-credit?campaign=${data.campaign?.$id}`);
+                return;
+            }
+            if ($redirectTo) {
+                window.location.href = $redirectTo;
+                return;
+            }
+
+            await invalidate(Dependencies.ACCOUNT);
+        } catch (error) {
+            disabled = false;
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+            trackError(error, Submit.AccountLogin);
+        }
+    }
+
+    async function resendCode() {
+        try {
+            disabled = true;
+            const sessionToken = await sdk.forConsole.account.createEmailToken({
+                userId: 'unique',
+                email: email
+            });
+            userId = sessionToken.userId;
+            addNotification({
+                type: 'success',
+                message: 'New sign in code sent to your email.'
+            });
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        } finally {
+            disabled = false;
+        }
+    }
+</script>
+
+<svelte:head>
+    <title>Enter your sign-in code - Appwrite</title>
+</svelte:head>
+
+<Unauthenticated coupon={data?.couponData} campaign={data?.campaign} align="center">
+    <svelte:fragment slot="title">Enter your sign-in code</svelte:fragment>
+    <svelte:fragment>
+        <Layout.Stack gap="l" justifyContent="center" alignContent="center" alignItems="center">
+            <Typography.Text align="center">
+                We sent a 6-digit code to {email}
+            </Typography.Text>
+
+            <form on:submit|preventDefault={verifyOTP}>
+                <Layout.Stack align="center">
+                    <InputDigits bind:value={otpCode} required />
+                    <Button submit {disabled} class="verify-button">Verify</Button>
+                </Layout.Stack>
+            </form>
+
+            <Typography.Text align="center">
+                Didn't get it?
+                <ResendCooldown
+                    storageKey={`otp_resend_${email}`}
+                    seconds={60}
+                    bind:disabled
+                    onResend={resendCode} />
+            </Typography.Text>
+        </Layout.Stack>
+    </svelte:fragment>
+</Unauthenticated>
diff --git a/src/routes/(public)/(guest)/login/email-otp/+page.ts b/src/routes/(public)/(guest)/login/email-otp/+page.ts
new file mode 100644
index 0000000000..974a7a0039
--- /dev/null
+++ b/src/routes/(public)/(guest)/login/email-otp/+page.ts
@@ -0,0 +1,39 @@
+import { base } from '$app/paths';
+import type { Campaign } from '$lib/stores/campaigns';
+import { sdk } from '$lib/stores/sdk';
+import { redirect } from '@sveltejs/kit';
+import type { PageLoad } from './$types';
+
+export const load: PageLoad = async ({ url }) => {
+    if (!url.searchParams.has('email')) {
+        redirect(303, `${base}/login`);
+    }
+
+    if (url.searchParams.has('code')) {
+        const code = url.searchParams.get('code');
+        let campaign: Campaign;
+        try {
+            const couponData = await sdk.forConsole.billing.getCoupon(code);
+            if (couponData.campaign) {
+                campaign = await sdk.forConsole.billing.getCampaign(couponData.campaign);
+                return {
+                    couponData,
+                    campaign
+                };
+            } else redirect(303, `${base}/login`);
+        } catch (e) {
+            redirect(303, `${base}/login`);
+        }
+    }
+    if (url.searchParams.has('campaign')) {
+        const campaignId = url.searchParams.get('campaign');
+        let campaign: Campaign;
+        try {
+            campaign = await sdk.forConsole.billing.getCampaign(campaignId);
+            return { campaign };
+        } catch (e) {
+            redirect(303, `${base}/login`);
+        }
+    }
+    return;
+};