diff --git a/app/assets/images/logo-black.svg b/app/assets/images/logo-black.svg
new file mode 100644
index 00000000..1f2f9405
--- /dev/null
+++ b/app/assets/images/logo-black.svg
@@ -0,0 +1,7 @@
+<svg width="94" height="20" viewBox="0 0 94 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.3019 3.39623C20.761 3.39623 21.956 3.84277 22.8868 4.73585C23.8302 5.61635 24.3019 6.98742 24.3019 8.84906V15.0943H19.9623V9.5283C19.9623 8.59748 19.7547 7.9434 19.3396 7.56604C18.9245 7.1761 18.2642 6.98113 17.3585 6.98113C16.4528 6.98113 15.717 7.18239 15.1509 7.58491C14.5975 7.98742 14.3208 8.63522 14.3208 9.5283V15.0943H9.98113V9.5283C9.98113 8.59748 9.77359 7.9434 9.35849 7.56604C8.9434 7.1761 8.28302 6.98113 7.37736 6.98113C6.4717 6.98113 5.73585 7.18239 5.16981 7.58491C4.61635 7.98742 4.33962 8.63522 4.33962 9.5283V15.0943H0V3.77358H4.33962V5.77358C5.63522 4.18868 7.2956 3.39623 9.32076 3.39623C10.3899 3.39623 11.327 3.63522 12.1321 4.11321C12.9497 4.57862 13.5409 5.30818 13.9057 6.30189C14.5723 5.37107 15.3459 4.65409 16.2264 4.15094C17.1069 3.6478 18.1321 3.39623 19.3019 3.39623Z" fill="#242629"/>
+<path d="M34.7652 3.39623C36.3752 3.39623 37.6897 3.59119 38.7086 3.98113C39.74 4.37107 40.5073 5 41.0105 5.86792C41.5262 6.72327 41.7903 7.86792 41.8029 9.30189V15.0943H37.4633V13.5849C36.5199 14.1635 35.4759 14.5912 34.3312 14.8679C33.1991 15.1447 32.0985 15.283 31.0293 15.283C29.4319 15.283 28.1614 15 27.218 14.434C26.2746 13.8679 25.8029 12.9497 25.8029 11.6792C25.8029 10.2704 26.4256 9.27673 27.6708 8.69811C28.9161 8.10692 30.4633 7.81132 32.3124 7.81132C33.9098 7.81132 35.6268 8 37.4633 8.37736C37.413 7.6478 37.0859 7.13837 36.4822 6.84906C35.891 6.55975 35.0482 6.41509 33.9539 6.41509C32.9602 6.41509 31.9476 6.49057 30.9161 6.64151C29.8973 6.77987 28.7023 7.00629 27.3312 7.32075L26.7274 4.35849C29.608 3.71698 32.2872 3.39623 34.7652 3.39623ZM32.5199 12.2642C33.5513 12.2642 35.1991 12.0755 37.4633 11.6981V10.8302C35.7023 10.5786 34.1991 10.4528 32.9539 10.4528C31.9979 10.4528 31.3186 10.522 30.9161 10.6604C30.5262 10.7987 30.3312 11.0377 30.3312 11.3774C30.3312 11.7044 30.4947 11.9371 30.8218 12.0755C31.1488 12.2013 31.7149 12.2642 32.5199 12.2642Z" fill="#242629"/>
+<path d="M55.0136 3.77358H59.4098L54.089 14.8113C53.523 15.9811 52.9381 16.9371 52.3343 17.6792C51.7431 18.434 51.0387 19.0063 50.2211 19.3962C49.4035 19.7987 48.4287 20 47.2966 20C46.6802 20 45.9947 19.9434 45.24 19.8302C44.4853 19.717 43.7431 19.5535 43.0136 19.3396V16.0377C44.6991 16.4151 45.9129 16.6038 46.6551 16.6038C47.196 16.6038 47.6173 16.5723 47.9192 16.5094C48.2337 16.4465 48.5104 16.3082 48.7494 16.0943C49.001 15.8805 49.2588 15.5472 49.523 15.0943H47.4853L42.0702 3.77358H46.4664L50.7305 12.6792L55.0136 3.77358Z" fill="#242629"/>
+<path d="M70.216 3.39623C71.2851 3.39623 72.2851 3.59748 73.216 4C74.1468 4.38994 74.9078 5.03774 75.499 5.9434C76.1027 6.83648 76.4046 8 76.4046 9.43396C76.4046 10.8679 76.1027 12.0377 75.499 12.9434C74.9078 13.8365 74.1468 14.4843 73.216 14.8868C72.2851 15.2767 71.2851 15.4717 70.216 15.4717C69.109 15.4717 68.0902 15.283 67.1594 14.9057C66.2411 14.5157 65.5116 13.9057 64.9707 13.0755V15.0943H60.631V0H64.9707V5.79245C65.5116 4.96226 66.2411 4.35849 67.1594 3.98113C68.0902 3.59119 69.109 3.39623 70.216 3.39623ZM68.4235 11.8868C69.5807 11.8868 70.4424 11.6855 71.0084 11.283C71.587 10.8805 71.8763 10.2642 71.8763 9.43396C71.8763 8.60377 71.587 7.98742 71.0084 7.58491C70.4424 7.18239 69.5807 6.98113 68.4235 6.98113C67.2663 6.98113 66.3983 7.18239 65.8197 7.58491C65.2537 7.98742 64.9707 8.60377 64.9707 9.43396C64.9707 10.2642 65.2537 10.8805 65.8197 11.283C66.3983 11.6855 67.2663 11.8868 68.4235 11.8868Z" fill="#242629"/>
+<path d="M86.1885 12.2642C87.1948 12.2642 87.9558 12.1635 88.4716 11.9623C88.9999 11.7484 89.3646 11.4403 89.5659 11.0377H93.8112C93.4212 12.4969 92.5973 13.6038 91.3395 14.3585C90.0942 15.1006 88.3206 15.4717 86.0187 15.4717C83.4275 15.4717 81.4087 14.956 79.9621 13.9245C78.5156 12.8931 77.7923 11.3962 77.7923 9.43396C77.7923 8.12579 78.1319 7.02516 78.8112 6.13208C79.4904 5.22641 80.4338 4.54717 81.6414 4.09434C82.8489 3.62893 84.2514 3.39623 85.8489 3.39623C88.3521 3.39623 90.3206 3.96226 91.7546 5.09434C93.1885 6.22641 93.9055 7.91195 93.9055 10.1509H82.1885C82.3269 10.9308 82.7231 11.478 83.3772 11.7925C84.0439 12.1069 84.981 12.2642 86.1885 12.2642ZM85.8489 6.22642C84.8929 6.22642 84.1256 6.36478 83.547 6.64151C82.9684 6.91824 82.5659 7.37107 82.3395 8H89.415C89.176 7.37107 88.7609 6.91824 88.1697 6.64151C87.5911 6.36478 86.8175 6.22642 85.8489 6.22642Z" fill="#242629"/>
+</svg>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 497a1ba6..d4b5be48 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html class="h-full bg-gray-50">
   <head>
     <title>Maybe</title>
     <meta name="viewport" content="width=device-width,initial-scale=1">
@@ -13,9 +13,125 @@
     <%= hotwire_livereload_tags if Rails.env.development? %>
   </head>
 
-  <body>
-    <main class="container flex px-5 mx-auto mt-28">
-      <%= yield %>
-    </main>
+  <body class="h-full">
+    <div>
+      <div class="relative z-50 lg:hidden" role="dialog" aria-modal="true">
+        <div class="fixed inset-0 bg-gray-900/80"></div>
+
+        <div class="fixed inset-0 flex">
+          <div class="relative flex flex-1 w-full max-w-xs mr-16">
+            <div class="absolute top-0 flex justify-center w-16 pt-5 left-full">
+              <button type="button" class="-m-2.5 p-2.5">
+                <span class="sr-only">Close sidebar</span>
+                <svg class="w-6 h-6 text-white" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+                </svg>
+              </button>
+            </div>
+
+            <!-- Sidebar component, swap this element with another sidebar if you like -->
+            <div class="flex flex-col px-6 pb-2 overflow-y-auto bg-white grow gap-y-5">
+              <div class="flex items-center h-16 shrink-0">
+                <%= image_tag "logo-black.svg", class: 'w-auto h-8' %>
+              </div>
+              <nav class="flex flex-col flex-1">
+                <ul role="list" class="flex flex-col flex-1 gap-y-7">
+                  <li>
+                    <ul role="list" class="-mx-2 space-y-1">
+                      <li>
+                        <!-- Current: "bg-gray-50 text-indigo-600", Default: "text-gray-700 hover:text-indigo-600 hover:bg-gray-50" -->
+                        <a href="#" class="flex p-2 text-sm font-semibold leading-6 text-blue-600 rounded-md bg-gray-50 group gap-x-3">
+                          <svg class="w-6 h-6 text-blue-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" />
+                          </svg>
+                          Dashboard
+                        </a>
+                      </li>
+                    </ul>
+                  </li>
+                  <li>
+                    <div class="text-xs font-semibold leading-6 text-gray-400">Accounts</div>
+                    <ul role="list" class="mt-2 -mx-2 space-y-1">
+                      <li>
+                        <!-- Current: "bg-gray-50 text-indigo-600", Default: "text-gray-700 hover:text-indigo-600 hover:bg-gray-50" -->
+                        <a href="#" class="flex p-2 text-sm font-semibold leading-6 text-gray-700 rounded-md hover:text-indigo-600 hover:bg-gray-50 group gap-x-3">
+                          <span class="truncate">XYZ Bank</span>
+                        </a>
+                      </li>
+                    </ul>
+                  </li>
+                </ul>
+              </nav>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Static sidebar for desktop -->
+      <div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-72 lg:flex-col">
+        <!-- Sidebar component, swap this element with another sidebar if you like -->
+        <div class="flex flex-col px-6 overflow-y-auto bg-white border-r border-gray-200 grow gap-y-5">
+          <div class="flex items-center h-16 shrink-0">
+            <%= image_tag "logo-black.svg", class: 'w-auto h-5' %>
+          </div>
+          <nav class="flex flex-col flex-1">
+            <ul role="list" class="flex flex-col flex-1 gap-y-7">
+              <li>
+                <ul role="list" class="-mx-2 space-y-1">
+                  <li>
+                    <!-- Current: "bg-gray-50 text-indigo-600", Default: "text-gray-700 hover:text-indigo-600 hover:bg-gray-50" -->
+                    <%= link_to root_path, class: "flex p-2 text-sm font-semibold leading-6 text-blue-600 rounded-md bg-gray-50 group gap-x-3" do %>
+                      <svg class="w-6 h-6 text-blue-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+                        <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" />
+                      </svg>
+                      Dashboard
+                    <% end %>
+                  </li>
+                </ul>
+              </li>
+              <li>
+                <div class="text-xs font-semibold leading-6 text-gray-400">Accounts</div>
+                <ul role="list" class="mt-2 -mx-2 space-y-1">
+                  <li>
+                    <!-- Current: "bg-gray-50 text-indigo-600", Default: "text-gray-700 hover:text-indigo-600 hover:bg-gray-50" -->
+                    <a href="#" class="flex p-2 text-sm font-semibold leading-6 text-gray-700 rounded-md hover:text-blue-600 hover:bg-gray-50 group gap-x-3">
+                      <span class="truncate">XYZ Bank</span>
+                    </a>
+                  </li>
+                </ul>
+              </li>
+              <li class="mt-auto -mx-6">
+                <a href="#" class="flex items-center px-6 py-3 text-sm font-semibold leading-6 text-gray-900 gap-x-4 hover:bg-gray-50">
+                  <span class="sr-only">Your profile</span>
+                  <span aria-hidden="true"><%= current_user.email %></span>
+                </a>
+              </li>
+            </ul>
+          </nav>
+        </div>
+      </div>
+
+      <div class="sticky top-0 z-40 flex items-center px-4 py-4 bg-white shadow-sm gap-x-6 sm:px-6 lg:hidden">
+        <button type="button" class="-m-2.5 p-2.5 text-gray-700 lg:hidden">
+          <span class="sr-only">Open sidebar</span>
+          <svg class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
+          </svg>
+        </button>
+        <div class="flex-1 text-sm font-semibold leading-6 text-gray-900">Dashboard</div>
+        <a href="#">
+          <span class="sr-only">Your profile</span>
+          <img class="w-8 h-8 rounded-full bg-gray-50" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
+        </a>
+      </div>
+
+      <main class="lg:pl-72">
+        <div class="xl:pr-96">
+          <div class="px-4 py-10 sm:px-6 lg:px-8 lg:py-6">
+            <%= yield %>
+          </div>
+        </div>
+      </main>
+    </div>
   </body>
 </html>
diff --git a/app/views/pages/home.html.erb b/app/views/pages/dashboard.html.erb
similarity index 83%
rename from app/views/pages/home.html.erb
rename to app/views/pages/dashboard.html.erb
index a73b0f30..63110faf 100644
--- a/app/views/pages/home.html.erb
+++ b/app/views/pages/dashboard.html.erb
@@ -1,4 +1,4 @@
 <div class="prose">
-  <h1>Home</h1>
+  <h1>Dashboard</h1>
   <p><%= link_to "Sign out", destroy_user_session_path, method: :delete %></p>
 </div>
\ No newline at end of file
diff --git a/config/routes.rb b/config/routes.rb
index 0b1dc8f8..3639306b 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -1,10 +1,10 @@
 Rails.application.routes.draw do
   devise_for :users
-  
+
   # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.
   # Can be used by load balancers and uptime monitors to verify that the app is live.
   get "up" => "rails/health#show", as: :rails_health_check
 
   # Defines the root path route ("/")
-  root "pages#home"
+  root "pages#dashboard"
 end