diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 13b0804..348d60d 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "@albedo-link/intent": "^0.13.0",
+        "@hookform/resolvers": "^5.4.0",
         "@radix-ui/react-slot": "^1.0.2",
         "@stellar/freighter-api": "^6.0.1",
         "@stellar/stellar-sdk": "^14.5.0",
@@ -27,6 +28,7 @@
         "qrcode": "^1.5.4",
         "react": "18.2.0",
         "react-dom": "18.2.0",
+        "react-hook-form": "^7.80.0",
         "recharts": "^3.7.0",
         "tailwind-merge": "^2.0.0",
         "tailwindcss": "^3.3.0",
@@ -2154,6 +2156,18 @@
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
+    "node_modules/@hookform/resolvers": {
+      "version": "5.4.0",
+      "resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-5.4.0.tgz",
+      "integrity": "sha512-EIsqr/t/qbinPIhGjMdtvutIN1Kk4uwbROE9/UQ93CAVGR7GkA7Y92+fX80OzXi/OB67jVFYwKGO1WzkxmkFZw==",
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/utils": "^0.3.0"
+      },
+      "peerDependencies": {
+        "react-hook-form": "^7.55.0"
+      }
+    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.13.0",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
@@ -12289,6 +12303,22 @@
         "react": "^18.2.0"
       }
     },
+    "node_modules/react-hook-form": {
+      "version": "7.80.0",
+      "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.80.0.tgz",
+      "integrity": "sha512-4P+fk6oXsxY+6xSj7Euhc2sumQD8zQqCuVHoJwoyp9EchP+IUW9OESB7uHFJOKsIBQ4MQqYE84INJFqUCYNoOg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/react-hook-form"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17 || ^18 || ^19"
+      }
+    },
     "node_modules/react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 6a489a4..94fa5de 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "@albedo-link/intent": "^0.13.0",
+    "@hookform/resolvers": "^5.4.0",
     "@radix-ui/react-slot": "^1.0.2",
     "@stellar/freighter-api": "^6.0.1",
     "@stellar/stellar-sdk": "^14.5.0",
@@ -30,6 +31,7 @@
     "qrcode": "^1.5.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
+    "react-hook-form": "^7.80.0",
     "recharts": "^3.7.0",
     "tailwind-merge": "^2.0.0",
     "tailwindcss": "^3.3.0",
diff --git a/frontend/src/components/auth/LoginForm.tsx b/frontend/src/components/auth/LoginForm.tsx
index 4673835..7de7104 100644
--- a/frontend/src/components/auth/LoginForm.tsx
+++ b/frontend/src/components/auth/LoginForm.tsx
@@ -1,6 +1,7 @@
 "use client";
 
-import { useState, useEffect } from 'react';
+import { useForm } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
 import { useAuth } from '@/hooks/useAuth';
 import { useRouter } from 'next/navigation';
 import Link from 'next/link';
@@ -9,6 +10,7 @@ import { Input } from '@/components/ui/Input';
 import { SocialLogin } from './SocialLogin';
 import { AlertCircle } from 'lucide-react';
 import { cn } from '@/lib/utils';
+import { loginSchema, type LoginFormInput, type LoginFormData } from '@/lib/validations/auth';
 
 interface LoginFormProps {
   className?: string;
@@ -17,49 +19,25 @@ interface LoginFormProps {
 export function LoginForm({ className }: LoginFormProps) {
   const { login, loading, error, clearError } = useAuth();
   const router = useRouter();
-  
-  const [formData, setFormData] = useState({
-    email: '',
-    password: '',
-    rememberMe: false,
+
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+  } = useForm<LoginFormInput, unknown, LoginFormData>({
+    resolver: zodResolver(loginSchema),
+    defaultValues: { email: '', password: '', rememberMe: false },
   });
-  
-  const [errors, setErrors] = useState<Record<string, string>>({});
 
-  // Clear errors when form changes
-  useEffect(() => {
+  const onSubmit = async (values: LoginFormData) => {
     clearError();
-    setErrors({});
-  }, [formData, clearError]);
-
-  const validate = () => {
-    const newErrors: Record<string, string> = {};
-    
-    if (!formData.email.trim()) {
-      newErrors.email = 'Email is required';
-    } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
-      newErrors.email = 'Invalid email address';
-    }
-    
-    if (!formData.password) {
-      newErrors.password = 'Password is required';
-    }
-    
-    setErrors(newErrors);
-    return Object.keys(newErrors).length === 0;
-  };
 
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    
-    if (!validate()) return;
-    
     await login({
-      email: formData.email,
-      password: formData.password,
-      rememberMe: formData.rememberMe,
+      email: values.email,
+      password: values.password,
+      rememberMe: values.rememberMe,
     });
-    
+
     if (!error) {
       router.push('/');
     }
@@ -72,7 +50,7 @@ export function LoginForm({ className }: LoginFormProps) {
 
   return (
     <div className={cn('space-y-6', className)}>
-      <form onSubmit={handleSubmit} className="space-y-4">
+      <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
         <div className="space-y-1">
           <label htmlFor="email" className="block text-sm font-medium text-foreground">
             Email address
@@ -82,8 +60,7 @@ export function LoginForm({ className }: LoginFormProps) {
             type="email"
             autoComplete="email"
             placeholder="you@example.com"
-            value={formData.email}
-            onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+            {...register('email')}
             error={!!errors.email || !!error}
             aria-describedby={errors.email ? "email-error" : undefined}
             aria-invalid={!!errors.email || !!error}
@@ -91,7 +68,7 @@ export function LoginForm({ className }: LoginFormProps) {
           {errors.email && (
             <p id="email-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.email}
+              {errors.email.message}
             </p>
           )}
         </div>
@@ -110,8 +87,7 @@ export function LoginForm({ className }: LoginFormProps) {
             type="password"
             autoComplete="current-password"
             placeholder="••••••••"
-            value={formData.password}
-            onChange={(e) => setFormData({ ...formData, password: e.target.value })}
+            {...register('password')}
             error={!!errors.password || !!error}
             aria-describedby={errors.password ? "password-error" : undefined}
             aria-invalid={!!errors.password || !!error}
@@ -119,7 +95,7 @@ export function LoginForm({ className }: LoginFormProps) {
           {errors.password && (
             <p id="password-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.password}
+              {errors.password.message}
             </p>
           )}
         </div>
@@ -135,8 +111,7 @@ export function LoginForm({ className }: LoginFormProps) {
           <input
             id="remember-me"
             type="checkbox"
-            checked={formData.rememberMe}
-            onChange={(e) => setFormData({ ...formData, rememberMe: e.target.checked })}
+            {...register('rememberMe')}
             className="h-4 w-4 rounded border-border text-primary focus:ring-primary"
           />
           <label htmlFor="remember-me" className="ml-2 block text-sm text-muted-foreground">
diff --git a/frontend/src/components/auth/RegisterForm.tsx b/frontend/src/components/auth/RegisterForm.tsx
index d732600..d9c62f2 100644
--- a/frontend/src/components/auth/RegisterForm.tsx
+++ b/frontend/src/components/auth/RegisterForm.tsx
@@ -1,11 +1,13 @@
 "use client";
 
 import { useState, useEffect } from 'react';
+import { useForm } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
 import { CheckCircle2, XCircle, Loader2, AlertCircle } from 'lucide-react';
 import { useAuth } from '@/hooks/useAuth';
 import { useRouter } from 'next/navigation';
 import { useUsernameAvailability } from '@/hooks/useUsernameAvailability';
-import { registerSchema } from '@/lib/validations/auth';
+import { registerSchema, type RegisterFormData } from '@/lib/validations/auth';
 import { Button } from '@/components/ui/Button';
 import { Input } from '@/components/ui/Input';
 import { SocialLogin } from './SocialLogin';
@@ -17,19 +19,25 @@ interface RegisterFormProps {
 }
 
 export function RegisterForm({ className }: RegisterFormProps) {
-  const { register, loading, error, clearError, user } = useAuth();
+  const { register: registerUser, loading, error, clearError, user } = useAuth();
   const router = useRouter();
 
-  const [formData, setFormData] = useState({
-    username: '',
-    email: '',
-    password: '',
-    confirmPassword: '',
-    agreeToTerms: false,
+  const {
+    register,
+    handleSubmit,
+    watch,
+    formState: { errors },
+  } = useForm<RegisterFormData>({
+    resolver: zodResolver(registerSchema),
+    defaultValues: { username: '', email: '', password: '', confirmPassword: '' },
   });
 
-  const [errors, setErrors] = useState<Record<string, string>>({});
-  const usernameStatus = useUsernameAvailability(formData.username);
+  const [agreeToTerms, setAgreeToTerms] = useState(false);
+  const [termsError, setTermsError] = useState<string | null>(null);
+
+  const usernameValue = watch('username');
+  const passwordValue = watch('password');
+  const usernameStatus = useUsernameAvailability(usernameValue);
 
   useEffect(() => {
     if (user) {
@@ -37,53 +45,23 @@ export function RegisterForm({ className }: RegisterFormProps) {
     }
   }, [user, router]);
 
-  useEffect(() => {
-    clearError();
-    setErrors({});
-  }, [formData, clearError]);
-
-  const validate = (): boolean => {
-    const result = registerSchema.safeParse({
-      username: formData.username,
-      email: formData.email,
-      password: formData.password,
-      confirmPassword: formData.confirmPassword,
-    });
-
-    const newErrors: Record<string, string> = {};
-
-    if (!result.success) {
-      result.error.issues.forEach((issue) => {
-        const path = String(issue.path[0]);
-        if (path && !newErrors[path]) newErrors[path] = issue.message;
-      });
+  const onSubmit = async (values: RegisterFormData) => {
+    if (!agreeToTerms) {
+      setTermsError('You must agree to the terms');
+      return;
     }
+    setTermsError(null);
 
-    if (!formData.agreeToTerms) {
-      newErrors.agreeToTerms = 'You must agree to the terms';
+    if (usernameStatus === 'unavailable' || usernameStatus === 'checking') {
+      return;
     }
 
-    if (usernameStatus === 'unavailable') {
-      newErrors.username = 'This username is already taken';
-    } else if (usernameStatus === 'checking') {
-      newErrors.username = 'Please wait while we check username availability';
-    } else if (usernameStatus === 'error') {
-      newErrors.username = 'Could not verify username availability. Please try again.';
-    }
-
-    setErrors(newErrors);
-    return Object.keys(newErrors).length === 0;
-  };
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    if (!validate()) return;
-
-    await register({
-      username: formData.username,
-      email: formData.email,
-      password: formData.password,
-      confirmPassword: formData.confirmPassword,
+    clearError();
+    await registerUser({
+      username: values.username,
+      email: values.email,
+      password: values.password,
+      confirmPassword: values.confirmPassword,
     });
 
     if (!error) {
@@ -98,7 +76,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
 
   return (
     <div className={cn('space-y-6', className)}>
-      <form onSubmit={handleSubmit} className="space-y-4">
+      <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
         {/* Username */}
         <div className="space-y-1">
           <label htmlFor="username" className="block text-sm font-medium text-foreground">
@@ -110,8 +88,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
               type="text"
               autoComplete="username"
               placeholder="yourusername"
-              value={formData.username}
-              onChange={(e) => setFormData({ ...formData, username: e.target.value })}
+              {...register('username')}
               error={!!errors.username || usernameStatus === 'unavailable'}
               aria-describedby="rf-username-hint rf-username-status"
               aria-invalid={!!errors.username || usernameStatus === 'unavailable'}
@@ -158,7 +135,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
           {errors.username && (
             <p id="username-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.username}
+              {errors.username.message}
             </p>
           )}
         </div>
@@ -173,8 +150,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
             type="email"
             autoComplete="email"
             placeholder="you@example.com"
-            value={formData.email}
-            onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+            {...register('email')}
             error={!!errors.email || !!error}
             aria-describedby={errors.email ? 'rf-email-error' : undefined}
             aria-invalid={!!errors.email || !!error}
@@ -182,7 +158,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
           {errors.email && (
             <p id="register-email-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.email}
+              {errors.email.message}
             </p>
           )}
         </div>
@@ -197,17 +173,16 @@ export function RegisterForm({ className }: RegisterFormProps) {
             type="password"
             autoComplete="new-password"
             placeholder="••••••••"
-            value={formData.password}
-            onChange={(e) => setFormData({ ...formData, password: e.target.value })}
+            {...register('password')}
             error={!!errors.password}
             aria-describedby={errors.password ? 'rf-password-error' : undefined}
             aria-invalid={!!errors.password}
           />
-          <PasswordStrengthIndicator password={formData.password} />
+          <PasswordStrengthIndicator password={passwordValue} />
           {errors.password && (
             <p id="register-password-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.password}
+              {errors.password.message}
             </p>
           )}
         </div>
@@ -222,8 +197,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
             type="password"
             autoComplete="new-password"
             placeholder="••••••••"
-            value={formData.confirmPassword}
-            onChange={(e) => setFormData({ ...formData, confirmPassword: e.target.value })}
+            {...register('confirmPassword')}
             error={!!errors.confirmPassword}
             aria-describedby={errors.confirmPassword ? 'rf-confirm-error' : undefined}
             aria-invalid={!!errors.confirmPassword}
@@ -231,7 +205,7 @@ export function RegisterForm({ className }: RegisterFormProps) {
           {errors.confirmPassword && (
             <p id="confirm-password-error" className="flex items-center gap-1 text-xs text-destructive">
               <AlertCircle className="h-3 w-3" aria-hidden="true" />
-              {errors.confirmPassword}
+              {errors.confirmPassword.message}
             </p>
           )}
         </div>
@@ -249,8 +223,11 @@ export function RegisterForm({ className }: RegisterFormProps) {
             <input
               id="agree-terms"
               type="checkbox"
-              checked={formData.agreeToTerms}
-              onChange={(e) => setFormData({ ...formData, agreeToTerms: e.target.checked })}
+              checked={agreeToTerms}
+              onChange={(e) => {
+                setAgreeToTerms(e.target.checked);
+                if (e.target.checked) setTermsError(null);
+              }}
               className="h-4 w-4 rounded border-border text-primary focus:ring-primary"
             />
           </div>
@@ -265,10 +242,10 @@ export function RegisterForm({ className }: RegisterFormProps) {
                 Privacy Policy
               </a>
             </label>
-            {errors.agreeToTerms && (
+            {termsError && (
               <p className="flex items-center gap-1 mt-1 text-xs text-destructive">
                 <AlertCircle className="h-3 w-3" />
-                {errors.agreeToTerms}
+                {termsError}
               </p>
             )}
           </div>
diff --git a/frontend/src/lib/validations/auth.ts b/frontend/src/lib/validations/auth.ts
index 091afe5..1830b44 100644
--- a/frontend/src/lib/validations/auth.ts
+++ b/frontend/src/lib/validations/auth.ts
@@ -28,5 +28,6 @@ export const registerSchema = z
     path: ["confirmPassword"],
   });
 
+export type LoginFormInput = z.input<typeof loginSchema>;
 export type LoginFormData = z.infer<typeof loginSchema>;
 export type RegisterFormData = z.infer<typeof registerSchema>;