diff --git a/client/src/App.vue b/client/src/App.vue
index bfc492f7..c164b217 100644
--- a/client/src/App.vue
+++ b/client/src/App.vue
@@ -2,8 +2,8 @@
   <div class="container skillbox">
     <header class="header skillbox__header">
       <top-navigation></top-navigation>
-      <router-link to="/" class="skillbox__header-logo">skillBOX</router-link>
-      <div>Hans Muster</div>
+      <router-link to="/" class="skillbox__header-logo">skillbox</router-link>
+      <profile></profile>
     </header>
     <router-view></router-view>
     <footer skillbox__footer>Footer</footer>
@@ -12,12 +12,14 @@
 
 <script>
   import TopNavigation from "@/components/TopNavigation.vue";
+  import Profile from "@/components/Profile.vue";
 
   export default {
     name: 'App',
 
     components: {
-      TopNavigation
+      TopNavigation,
+      Profile
     },
 
     data() {
diff --git a/client/src/components/Profile.vue b/client/src/components/Profile.vue
new file mode 100644
index 00000000..66d56727
--- /dev/null
+++ b/client/src/components/Profile.vue
@@ -0,0 +1,40 @@
+<template>
+  <div class="user-profile">
+    <img class="user-profile__avatar"
+         :src="avatar">
+    <span class="user-profile__name">Daniel Ramos</span>
+  </div>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        avatar: 'data:image/jpeg;base64,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'
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  @import "@/styles/_variables.scss";
+
+  .user-profile {
+    padding: 24px;
+    color: $color-grey;
+    display: flex;
+    align-items: center;
+
+    &__name {
+      padding: 0px 10px;
+      font-family: $sans-serif-font-family;
+
+    }
+
+    &__avatar {
+      width: 30px;
+      height: 30px;
+      border-radius: 15px;
+    }
+  }
+</style>