diff --git a/app/assets/images/person.svg b/app/assets/images/person.svg
new file mode 100644
index 0000000..73b6da6
--- /dev/null
+++ b/app/assets/images/person.svg
@@ -0,0 +1 @@
+<svg height="8" viewBox="0 0 8 8" width="8" xmlns="http://www.w3.org/2000/svg"><path d="m4 0c-1.1 0-2 1.12-2 2.5s.9 2.5 2 2.5 2-1.12 2-2.5-.9-2.5-2-2.5zm-2.09 5c-1.06.05-1.91.92-1.91 2v1h8v-1c0-1.08-.84-1.95-1.91-2-.54.61-1.28 1-2.09 1s-1.55-.39-2.09-1z"/></svg>
\ No newline at end of file
diff --git a/app/assets/images/print.svg b/app/assets/images/print.svg
new file mode 100644
index 0000000..1971557
--- /dev/null
+++ b/app/assets/images/print.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M26 6V1H6v5H2v12h4v5l8 8h12V18h4V6h-4zM8 3h16v3H8V3zm7 26v-7H8v-8h16v15h-9z"/></svg>
\ No newline at end of file
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 8c8773f..189a32b 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -6,14 +6,34 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
     <%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %>
-
     <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
     <%= javascript_importmap_tags %>
   </head>
-
   <body>
+    <header class="container mx-auto px-4 py-6 flex items-center justify-between">
+      <a href="/" class="font-bold text-black text-xl">Plottservice</a>
+      <nav>
+      </nav>
+      <nav>
+        <ul>
+          <li>
+            <a href="#" class="rounded-full px-3 py-2 font-semibold bg-white bg-opacity-10 flex items-center group">
+              <span class="mr-2">Sign in</span>
+              <svg class="stroke-current" width="10" height="10" viewBox="0 0 10 10" aria-hidden="true" style="stroke: rgb(194, 62, 110);">
+                <g fill-rule="evenodd">
+                  <path class="opacity-0 group-hover:opacity-100 transition ease-in-out duration-200" d="M0 5h7"></path>
+                  <path class="HoverArrow__tipPath" d="M1 1l4 4-4 4"></path>
+                </g>
+              </svg>
+            </a>
+          </li>
+        </ul>
+      </nav>
+    </header>
     <main class="container mx-auto mt-28 px-5 flex">
       <%= yield %>
     </main>
+    <footer>
+    </footer>
   </body>
 </html>
diff --git a/config/tailwind.config.js b/config/tailwind.config.js
index d6ad82c..09b0f40 100644
--- a/config/tailwind.config.js
+++ b/config/tailwind.config.js
@@ -1,22 +1,22 @@
-const defaultTheme = require('tailwindcss/defaultTheme')
+const defaultTheme = require("tailwindcss/defaultTheme");
 
 module.exports = {
   content: [
-    './public/*.html',
-    './app/helpers/**/*.rb',
-    './app/javascript/**/*.js',
-    './app/views/**/*.{erb,haml,html,slim}'
+    "./public/*.html",
+    "./app/helpers/**/*.rb",
+    "./app/javascript/**/*.js",
+    "./app/views/**/*.{erb,haml,html,slim}",
   ],
   theme: {
     extend: {
       fontFamily: {
-        sans: ['Inter var', ...defaultTheme.fontFamily.sans],
+        sans: ["Inter var", ...defaultTheme.fontFamily.sans],
       },
     },
   },
   plugins: [
-    require('@tailwindcss/forms'),
-    require('@tailwindcss/typography'),
-    require('@tailwindcss/container-queries'),
-  ]
-}
+    require("@tailwindcss/forms"),
+    require("@tailwindcss/typography"),
+    require("@tailwindcss/container-queries"),
+  ],
+};
