diff --git a/assets/background.png b/assets/background.png
deleted file mode 100644
index d0736c4..0000000
Binary files a/assets/background.png and /dev/null differ
diff --git a/assets/background.webp b/assets/background.webp
index feeef6b..55c482f 100644
Binary files a/assets/background.webp and b/assets/background.webp differ
diff --git a/assets/background2.webp b/assets/background2.webp
deleted file mode 100644
index 55c482f..0000000
Binary files a/assets/background2.webp and /dev/null differ
diff --git a/assets/login_background.webp b/assets/login_background.webp
new file mode 100644
index 0000000..f6a8179
Binary files /dev/null and b/assets/login_background.webp differ
diff --git a/assets/register_background.webp b/assets/register_background.webp
new file mode 100644
index 0000000..5235926
Binary files /dev/null and b/assets/register_background.webp differ
diff --git a/lib/pages/login_page.dart b/lib/pages/login_page.dart
index 99240a0..716be22 100644
--- a/lib/pages/login_page.dart
+++ b/lib/pages/login_page.dart
@@ -79,6 +79,7 @@ class _LoginPageState extends State<LoginPage> {
     return Scaffold(
         resizeToAvoidBottomInset: false,
         body: PageBackgroundWidget(
+          page: 'login',
           child: Center(
             child: Column(
               mainAxisAlignment: MainAxisAlignment.start,
diff --git a/lib/pages/register_page.dart b/lib/pages/register_page.dart
index 472a400..ba21097 100644
--- a/lib/pages/register_page.dart
+++ b/lib/pages/register_page.dart
@@ -61,59 +61,60 @@ class _RegisterPageState extends State<RegisterPage> {
   Widget build(BuildContext context) {
     return Scaffold(
       body: PageBackgroundWidget(
+          page: 'register',
           child: Center(
-        child: Column(
-          mainAxisAlignment: MainAxisAlignment.start,
-          children: [
-            const Gap(96),
-            const TitleWidget(firstTextSize: 20, secondTextSize: 32),
-            const Gap(32),
-            const TextWidget(text: 'Register'),
-            const Gap(16),
-            Padding(
-              padding: const EdgeInsets.only(left: 32, right: 32),
-              child: Container(
-                padding: EdgeInsets.fromLTRB(32, 32, 32, 40),
-                decoration: BoxDecoration(
-                    color: const Color.fromRGBO(57, 38, 62, 0.6),
-                    borderRadius: BorderRadius.all(Radius.circular(16)),
-                    boxShadow: [
-                      BoxShadow(
-                        color: const Color.fromRGBO(0, 0, 0, 0.2), // Subtle shadow to give depth
-                        spreadRadius: 0,
-                        blurRadius: 4,
-                        offset: Offset(0, 2),
-                      )
-                    ]),
-                child: Form(
-                    child: Column(
-                  children: [
-                    InputWidget(label: 'Email', controller: _emailController),
-                    const Gap(16),
-                    InputWidget(
-                      label: 'Password',
-                      controller: _passwordController,
-                      password: true,
-                    ),
-                    const Gap(16),
-                    InputWidget(
-                      label: 'Confirm Password',
-                      controller: _confirmPasswordController,
-                      password: true,
-                    ),
-                    const Gap(40),
-                    // TextButton(onPressed: () => {_signIn()}, child: const Text('Login'))
-                    if (_isLoading)
-                      Center(child: CircularProgressIndicator(color: Colors.white))
-                    else
-                      ButtonWidget(text: 'Create Account', onPressed: _signUp)
-                  ],
-                )),
-              ),
+            child: Column(
+              mainAxisAlignment: MainAxisAlignment.start,
+              children: [
+                const Gap(96),
+                const TitleWidget(firstTextSize: 20, secondTextSize: 32),
+                const Gap(32),
+                const TextWidget(text: 'Register'),
+                const Gap(16),
+                Padding(
+                  padding: const EdgeInsets.only(left: 32, right: 32),
+                  child: Container(
+                    padding: EdgeInsets.fromLTRB(32, 32, 32, 40),
+                    decoration: BoxDecoration(
+                        color: const Color.fromRGBO(57, 38, 62, 0.6),
+                        borderRadius: BorderRadius.all(Radius.circular(16)),
+                        boxShadow: [
+                          BoxShadow(
+                            color: const Color.fromRGBO(0, 0, 0, 0.2), // Subtle shadow to give depth
+                            spreadRadius: 0,
+                            blurRadius: 4,
+                            offset: Offset(0, 2),
+                          )
+                        ]),
+                    child: Form(
+                        child: Column(
+                      children: [
+                        InputWidget(label: 'Email', controller: _emailController),
+                        const Gap(16),
+                        InputWidget(
+                          label: 'Password',
+                          controller: _passwordController,
+                          password: true,
+                        ),
+                        const Gap(16),
+                        InputWidget(
+                          label: 'Confirm Password',
+                          controller: _confirmPasswordController,
+                          password: true,
+                        ),
+                        const Gap(40),
+                        // TextButton(onPressed: () => {_signIn()}, child: const Text('Login'))
+                        if (_isLoading)
+                          Center(child: CircularProgressIndicator(color: Colors.white))
+                        else
+                          ButtonWidget(text: 'Create Account', onPressed: _signUp)
+                      ],
+                    )),
+                  ),
+                ),
+              ],
             ),
-          ],
-        ),
-      )),
+          )),
     );
   }
 }
diff --git a/lib/widgets/page_background_widget.dart b/lib/widgets/page_background_widget.dart
index 8b802e8..9ebaea9 100644
--- a/lib/widgets/page_background_widget.dart
+++ b/lib/widgets/page_background_widget.dart
@@ -2,30 +2,37 @@ import 'package:flutter/material.dart';
 
 class PageBackgroundWidget extends StatelessWidget {
   final Widget child;
+  final String? page;
 
-  const PageBackgroundWidget({super.key, required this.child});
+  const PageBackgroundWidget({super.key, required this.child, this.page});
 
   @override
   Widget build(BuildContext context) {
     return SingleChildScrollView(
       scrollDirection: Axis.vertical,
-      // physics: NeverScrollableScrollPhysics(),
       child: Container(
           alignment: Alignment.center,
           height: MediaQuery.of(context).size.height + 200,
-          decoration: const BoxDecoration(
-            image: DecorationImage(image: AssetImage('assets/background2.webp'), fit: BoxFit.fitWidth, opacity: 0.2),
-            gradient: RadialGradient(
+          decoration: BoxDecoration(
+            image: DecorationImage(
+              // Image.asset('assets/ph_logo2.webp',
+              //     width: 192, cacheWidth: (192 * MediaQuery.of(context).devicePixelRatio).round()),
+              image: AssetImage(page == 'login'
+                  ? 'assets/login_background.webp'
+                  : page == 'register'
+                      ? 'assets/register_background.webp'
+                      : 'assets/background.webp'),
+              // image: Image.asset('assets/login_background.webp', width: 192, cacheWidth: (192 * MediaQuery.of(context).devicePixelRatio).round()),
+              fit: BoxFit.fitWidth,
+              alignment: Alignment.topCenter,
+              opacity: 0.2,
+            ),
+            gradient: const RadialGradient(
               tileMode: TileMode.clamp,
               colors: [
-                // Color.fromRGBO(132, 84, 125, 1),
-                // Color.fromRGBO(96, 48, 90, 1),
                 Color.fromRGBO(45, 15, 43, 1),
                 Color.fromRGBO(77, 29, 73, 1),
-                // Color.fromRGBO(241, 220, 223, 1),
               ],
-              // begin: Alignment.topCenter,
-              // end: Alignment.bottomCenter,
             ),
           ),
           child: Center(
diff --git a/pubspec.yaml b/pubspec.yaml
index 6e3cae3..a12b118 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -34,4 +34,5 @@ flutter:
     - assets/ph_logo.webp
     - assets/ph_logo2.webp
     - assets/background.webp
-    - assets/background2.webp
+    - assets/login_background.webp
+    - assets/register_background.webp