diff --git a/app/Http/Resources/UserResource.php b/app/Http/Resources/UserResource.php
index fd0591dd..21ced1d7 100644
--- a/app/Http/Resources/UserResource.php
+++ b/app/Http/Resources/UserResource.php
@@ -21,7 +21,9 @@ class UserResource extends JsonResource
     public function toArray($request): array
     {
         return [
-            'name' => $this->name,
+            'firstname' => $this->firstname,
+            'lastname' => $this->lastname,
+            'avatar_url' => $this->getGravatarUrl(),
             'email' => $this->email,
             'avatar' => [
                 'src' => Storage::url('avatar.png'),
diff --git a/app/User.php b/app/User.php
index 690c256a..bb1bdc3c 100644
--- a/app/User.php
+++ b/app/User.php
@@ -22,4 +22,9 @@ class User extends Authenticatable
     {
         $this->notify(new ResetPassword($token));
     }
+
+    public function getGravatarUrl(): string
+    {
+        return 'https://www.gravatar.com/avatar/' . hash('sha256', $this->email);
+    }
 }
diff --git a/database/factories/UserFactory.php b/database/factories/UserFactory.php
index 58673ba5..a8bd37bb 100644
--- a/database/factories/UserFactory.php
+++ b/database/factories/UserFactory.php
@@ -23,7 +23,8 @@ class UserFactory extends Factory
         return [
             'email' => $this->faker->safeEmail,
             'password' => Hash::make('password'),
-            'name' => $this->faker->firstName,
+            'firstname' => $this->faker->firstName,
+            'lastname' => $this->faker->lastName,
         ];
     }
 }
diff --git a/database/migrations/2024_07_31_215841_update_users_names.php b/database/migrations/2024_07_31_215841_update_users_names.php
new file mode 100644
index 00000000..e81e21be
--- /dev/null
+++ b/database/migrations/2024_07_31_215841_update_users_names.php
@@ -0,0 +1,56 @@
+<?php
+
+use App\User;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->string('firstname')->after('name')->nullable();
+            $table->string('lastname')->after('name')->nullable();
+        });
+
+        foreach (User::get() as $user) {
+            $user->update([]);
+        }
+
+        foreach (DB::table('users')->get() as $user) {
+            [$firstname, $lastname] = explode(' ', $user->name);
+            DB::table('users')->where('id', $user->id)->update(['firstname' => $firstname, 'lastname' => $lastname]);
+        }
+
+        Schema::table('users', function (Blueprint $table) {
+            $table->string('firstname')->nullable(false)->change();
+            $table->string('lastname')->nullable(false)->change();
+            $table->dropColumn('name');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->string('name');
+        });
+        foreach (DB::table('users')->get() as $user) {
+            DB::table('users')->where('id', $user->id)->update(['name' => $user->firstname . ' ' . $user->lastname]);
+        }
+        Schema::table('users', function (Blueprint $table) {
+            $table->dropColumn('firstname');
+            $table->dropColumn('lastname');
+        });
+    }
+};
diff --git a/resources/js/components/page/Header.vue b/resources/js/components/page/Header.vue
index a12e87e1..c0ac1fd9 100644
--- a/resources/js/components/page/Header.vue
+++ b/resources/js/components/page/Header.vue
@@ -5,7 +5,7 @@
             <page-title>{{ title }}</page-title>
             <slot name="toolbar"></slot>
         </div>
-        <div class="flex items-center space-x-2 ml-2">
+        <div class="flex items-center space-x-4 ml-2">
             <a v-if="$attrs.onClose" href="#" class="btn label btn-primary-light icon" @click.prevent="$emit('close')">
                 <ui-sprite class="w-3 h-3" src="close"></ui-sprite>
             </a>
diff --git a/resources/js/components/page/Layout.vue b/resources/js/components/page/Layout.vue
index f2b578b9..40c1ff55 100644
--- a/resources/js/components/page/Layout.vue
+++ b/resources/js/components/page/Layout.vue
@@ -12,6 +12,12 @@
             </template>
             <template #right>
                 <slot name="right"></slot>
+                <div class="flex items-center space-x-2">
+                    <div class="rounded-full overflow-hidden border-2 border-solid border-gray-300">
+                        <img :src="$page.props.auth.user.avatar_url" class="w-8 h-8 object-cover" />
+                    </div>
+                    <div class="text-gray-300" v-text="`${$page.props.auth.user.firstname} ${$page.props.auth.user.lastname}`"></div>
+                </div>
             </template>
         </page-header>
 
diff --git a/tests/Feature/DashboardTest.php b/tests/Feature/DashboardTest.php
index 1407049f..62d3120e 100644
--- a/tests/Feature/DashboardTest.php
+++ b/tests/Feature/DashboardTest.php
@@ -25,6 +25,19 @@ class DashboardTest extends TestCase
         $this->assertInertiaHas('Example', $response, 'blocks.0.title');
         $this->assertInertiaHas('exa', $response, 'blocks.0.component');
     }
+
+    public function testItDisplaysUserAvatar(): void
+    {
+        $this->withoutExceptionHandling();
+
+        $this->login()->loginNami();
+        auth()->user()->update(['firstname' => 'Bob', 'lastname' => 'Dylan', 'email' => 'max@email.com']);
+
+        $this->get('/')
+            ->assertInertiaPath('auth.user.firstname', 'Bob')
+            ->assertInertiaPath('auth.user.avatar_url', 'https://www.gravatar.com/avatar/' . hash('sha256', 'max@email.com'))
+            ->assertInertiaPath('auth.user.lastname', 'Dylan');
+    }
 }
 
 class ExampleBlock extends Block