diff --git a/frontend/app/lib/assets/hero-pattern-300x200.png b/frontend/app/lib/assets/hero-pattern-300x200.png
new file mode 100644
index 0000000..69a8390
Binary files /dev/null and b/frontend/app/lib/assets/hero-pattern-300x200.png differ
diff --git a/frontend/app/lib/assets/logo_300x200.png b/frontend/app/lib/assets/logo_300x200.png
new file mode 100644
index 0000000..0b4ca41
Binary files /dev/null and b/frontend/app/lib/assets/logo_300x200.png differ
diff --git a/frontend/app/lib/main.dart b/frontend/app/lib/main.dart
index bc298a4..19489d1 100644
--- a/frontend/app/lib/main.dart
+++ b/frontend/app/lib/main.dart
@@ -2,6 +2,9 @@ import 'package:flutter/material.dart';
 
 import 'package:app/pages/main_screen.dart';
 
-void main() {
-  runApp(MaterialApp(home: MainScreen()));
+void main() async {
+  WidgetsFlutterBinding.ensureInitialized();
+  runApp(MaterialApp(
+    home: MainScreen(),
+  ));
 }
diff --git a/frontend/app/lib/pages/main_screen.dart b/frontend/app/lib/pages/main_screen.dart
index 6719e77..615e60d 100644
--- a/frontend/app/lib/pages/main_screen.dart
+++ b/frontend/app/lib/pages/main_screen.dart
@@ -15,17 +15,55 @@ class MainScreen extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      body: Column(
-        mainAxisAlignment: MainAxisAlignment.center,
-        crossAxisAlignment: CrossAxisAlignment.center,
-        children: [
-          TextButton(
-              onPressed: () {
-                test();
-              },
-              child: const Text('Button'))
-        ],
+    return Container(
+      decoration: const BoxDecoration(
+        // color: Color.fromARGB(230, 255, 255, 255),
+        gradient: LinearGradient(
+          colors: [Colors.black, Colors.white],
+          begin: Alignment.topCenter,
+          end: Alignment.bottomCenter,
+        ),
+        image: DecorationImage(
+          image: AssetImage(
+            'lib/assets/hero-pattern-300x200.png',
+            // color: Colors.grey,
+          ),
+          repeat: ImageRepeat.repeat,
+          fit: BoxFit.contain,
+        ),
+      ),
+      child: Scaffold(
+        backgroundColor: Colors.transparent,
+        appBar: AppBar(
+          backgroundColor: Colors.black,
+          flexibleSpace: Image.asset(
+            'lib/assets/logo_300x200.png',
+            height: 80,
+          ),
+          actions: [
+            IconButton(
+              onPressed: () {},
+              icon: const Icon(Icons.menu),
+              tooltip: 'Menu',
+            ),
+            // IconButton(
+            //   onPressed: () {},
+            //   icon: const Icon(Icons.login_sharp),
+            //   tooltip: 'Login',
+            // ),
+          ],
+        ),
+        body: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: [
+            TextButton(
+                onPressed: () {
+                  test();
+                },
+                child: const Text('Button'))
+          ],
+        ),
       ),
     );
   }
diff --git a/frontend/app/pubspec.yaml b/frontend/app/pubspec.yaml
index 0372b7a..6b33b3f 100644
--- a/frontend/app/pubspec.yaml
+++ b/frontend/app/pubspec.yaml
@@ -64,7 +64,9 @@ flutter:
   uses-material-design: true
 
   # To add assets to your application, add an assets section, like this:
-  # assets:
+  assets:
+    - lib/assets/logo_300x200.png
+    - lib/assets/hero-pattern-300x200.png
   #   - images/a_dot_burr.jpeg
   #   - images/a_dot_ham.jpeg