diff --git a/public/img/icon-members.svg b/public/img/icon-members.svg
new file mode 100644
index 0000000..6259c8c
--- /dev/null
+++ b/public/img/icon-members.svg
@@ -0,0 +1,8 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M27.2463 19.67C29.2782 19.67 30.9257 17.3805 30.9257 14.555C30.9257 11.7295 29.2781 9.43848 27.2463 9.43848C25.2149 9.43848 23.5674 11.7295 23.5674 14.555C23.5674 17.3805 25.2149 19.67 27.2463 19.67Z" fill="white"/>
+<path d="M31.958 24.6002C31.7941 23.2303 30.9797 21.3131 30.3634 20.4566C30.2822 20.3431 29.9193 20.3168 29.8213 20.4013C29.0719 21.0422 28.1917 21.4194 27.2469 21.4194C26.3033 21.4194 25.4229 21.0422 24.6735 20.4013C24.5751 20.3168 24.2127 20.3431 24.1315 20.4566C23.9592 20.6962 23.7712 21.0151 23.5879 21.385C24.0838 22.6835 24.4771 24.0628 24.6191 25.2505C24.7609 26.4412 24.7149 27.5684 24.4855 28.5961C25.3003 29.006 26.2775 29.1859 27.2469 29.1859C29.7753 29.1859 32.3628 27.9668 31.958 24.6002Z" fill="white"/>
+<path d="M15.9054 17.5113C19.1984 17.5113 21.8681 13.7988 21.8681 9.2198C21.8681 4.64219 19.1984 0.929688 15.9054 0.929688C12.6131 0.929688 9.94434 4.64219 9.94434 9.2198C9.94434 13.7988 12.613 17.5113 15.9054 17.5113Z" fill="white"/>
+<path d="M20.9541 18.781C20.8247 18.6018 20.2372 18.556 20.0774 18.6935C18.8619 19.7335 17.4355 20.3423 15.9052 20.3423C14.3761 20.3423 12.949 19.7335 11.7341 18.6935C11.5744 18.556 10.9869 18.6018 10.8575 18.781C9.8562 20.1719 8.53651 23.2814 8.27101 25.4982C7.61639 30.9584 11.8106 32.9298 15.9052 32.9298C20.001 32.9298 24.1952 30.9584 23.5405 25.4982C23.275 23.2814 21.9554 20.1719 20.9541 18.781Z" fill="white"/>
+<path d="M4.75267 19.67C6.78404 19.67 8.43153 17.3805 8.43153 14.555C8.43153 11.7295 6.78404 9.43848 4.75267 9.43848C2.72074 9.43848 1.07324 11.7295 1.07324 14.555C1.07324 17.3805 2.72074 19.67 4.75267 19.67Z" fill="white"/>
+<path d="M7.19339 25.2505C7.34426 24.0031 7.76995 22.5343 8.30363 21.1761C8.15488 20.8936 8.0062 20.6474 7.86895 20.4566C7.78776 20.3431 7.42538 20.3168 7.32695 20.4013C6.57751 21.0422 5.6972 21.4194 4.75308 21.4194C3.80883 21.4194 2.92796 21.0422 2.17915 20.4013C2.08115 20.3168 1.71778 20.3431 1.63659 20.4566C1.01865 21.313 0.206467 23.2303 0.0419672 24.6002C-0.362282 27.9668 2.22471 29.1858 4.75308 29.1858C5.65539 29.1858 6.56657 29.0314 7.34426 28.6783C7.0992 27.6297 7.04732 26.4761 7.19339 25.2505Z" fill="white"/>
+</svg>
diff --git a/public/img/icon-project-summary.svg b/public/img/icon-project-summary.svg
new file mode 100644
index 0000000..7245a52
--- /dev/null
+++ b/public/img/icon-project-summary.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.28557 3.21582C6.23423 3.21582 4.57129 4.87877 4.57129 6.93011V26.9298C4.57129 28.9811 6.23423 30.6441 8.28557 30.6441H19.2201L16.7553 28.1791C15.7511 27.175 15.7511 25.5468 16.7553 24.5427C17.7594 23.5384 19.3876 23.5384 20.3917 24.5427L21.9999 26.1507L27.0387 21.1118C27.1602 20.9903 27.2908 20.8835 27.4284 20.7915V6.93011C27.4284 4.87876 25.7655 3.21582 23.7141 3.21582H8.28557ZM11.9999 10.9301C11.9999 11.7191 11.3603 12.3587 10.5713 12.3587C9.78231 12.3587 9.14272 11.7191 9.14272 10.9301C9.14272 10.1411 9.78231 9.50153 10.5713 9.50153C11.3603 9.50153 11.9999 10.1411 11.9999 10.9301ZM10.5713 18.3584C9.78231 18.3584 9.14272 17.7189 9.14272 16.9299C9.14272 16.141 9.78231 15.5013 10.5713 15.5013C11.3603 15.5013 11.9999 16.141 11.9999 16.9299C11.9999 17.7189 11.3603 18.3584 10.5713 18.3584ZM10.5713 24.3587C9.78231 24.3587 9.14272 23.7191 9.14272 22.9301C9.14272 22.1411 9.78231 21.5015 10.5713 21.5015C11.3603 21.5015 11.9999 22.1411 11.9999 22.9301C11.9999 23.7191 11.3603 24.3587 10.5713 24.3587ZM14.5713 10.073H21.9999C22.4732 10.073 22.857 10.4567 22.857 10.9301C22.857 11.4035 22.4732 11.7872 21.9999 11.7872H14.5713C14.0979 11.7872 13.7141 11.4035 13.7141 10.9301C13.7141 10.4567 14.0979 10.073 14.5713 10.073ZM13.7141 16.9299C13.7141 16.4565 14.0979 16.0727 14.5713 16.0727H21.9999C22.4732 16.0727 22.857 16.4565 22.857 16.9299C22.857 17.4032 22.4732 17.787 21.9999 17.787H14.5713C14.0979 17.787 13.7141 17.4032 13.7141 16.9299ZM14.5713 22.073H21.9999C22.4732 22.073 22.857 22.4567 22.857 22.9301C22.857 23.4035 22.4732 23.7873 21.9999 23.7873H14.5713C14.0979 23.7873 13.7141 23.4035 13.7141 22.9301C13.7141 22.4567 14.0979 22.073 14.5713 22.073Z" fill="white"/>
+<path d="M22.6059 30.3926L29.463 23.5354C29.7978 23.2007 29.7978 22.6581 29.463 22.3233C29.1283 21.9886 28.5857 21.9886 28.2509 22.3233L21.9998 28.5743L19.1796 25.7541C18.8449 25.4193 18.3021 25.4193 17.9674 25.7541C17.6326 26.0888 17.6326 26.6316 17.9674 26.9663L21.3938 30.3926C21.5545 30.5534 21.7725 30.6437 21.9998 30.6437C22.2271 30.6437 22.4452 30.5534 22.6059 30.3926Z" fill="white"/>
+</svg>
diff --git a/public/img/logo-light.png b/public/img/logo-light.png
new file mode 100644
index 0000000..5a3dcab
Binary files /dev/null and b/public/img/logo-light.png differ
diff --git a/resources/views/layout/core/header.blade.php b/resources/views/layout/core/header.blade.php
new file mode 100644
index 0000000..9744818
--- /dev/null
+++ b/resources/views/layout/core/header.blade.php
@@ -0,0 +1,21 @@
+<header class="bg-main-400 sticky top-0 right-0 flex justify-between items-center py-5 px-4 lg:px-16 xl:px-24">
+  <h1>
+    <a href={{ route('main') }}>
+      <img src="/img/logo-light.png" alt="">
+    </a>
+  </h1>
+
+  <nav>
+    <ul class="gap-4 font-medium text-white hidden lg:flex">
+      <li>
+        <a href={{ route('main') }}>Area de trabalho</a>
+      </li>
+      <li>
+        <a href="">Projetos</a>
+      </li>
+      <li>
+        <a href="">Equipes e pessoas</a>
+      </li>
+    </ul>
+  </nav>
+</header>
\ No newline at end of file
diff --git a/resources/views/layout/core/layout-full.blade.php b/resources/views/layout/core/layout-full.blade.php
new file mode 100644
index 0000000..a27229d
--- /dev/null
+++ b/resources/views/layout/core/layout-full.blade.php
@@ -0,0 +1,11 @@
+<div class="block lg:grid  grid-cols-[minmax(10vw,_250px)_1fr] h-full">
+  @include('layout.core.project-management-aside')
+
+  <div class="grid grid-rows-[125px,_1fr] max-h-screen">
+    @include('layout.core.header')
+
+    <main class="h-full overflow-y-scroll lg:p-16">
+      @yield('content')
+    </main>
+  </div>
+</div>
\ No newline at end of file
diff --git a/resources/views/layout/core/layout-partial.blade.php b/resources/views/layout/core/layout-partial.blade.php
new file mode 100644
index 0000000..d5f9867
--- /dev/null
+++ b/resources/views/layout/core/layout-partial.blade.php
@@ -0,0 +1,7 @@
+<div class="block lg:grid grid-rows-[125px,_1fr] max-h-screen">
+  @include('layout.core.header')
+
+  <main class="h-full overflow-y-scroll lg:p-16 xl:p-24">
+    @yield('content')
+  </main>
+</div>
\ No newline at end of file
diff --git a/resources/views/layout/core/layout.blade.php b/resources/views/layout/core/layout.blade.php
new file mode 100644
index 0000000..98c3952
--- /dev/null
+++ b/resources/views/layout/core/layout.blade.php
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+  <title>{{$title ?? 'Diagier'}}</title>
+  @vite('resources/css/app.css')
+</head>
+
+<body class="h-screen max-h-screen">
+  @if(Route::is('tasks.index'))
+    @include('layout.core.layout-full')
+  @else
+    @include('layout.core.layout-partial')
+  @endif
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/resources/views/layout/core/project-management-aside.blade.php b/resources/views/layout/core/project-management-aside.blade.php
new file mode 100644
index 0000000..f66c3a9
--- /dev/null
+++ b/resources/views/layout/core/project-management-aside.blade.php
@@ -0,0 +1,28 @@
+<aside class="bg-main-400  pt-[calc(125px+24px)] text-white px-8 hidden lg:block">
+  <h2 class="mb-8 text-xl font-bold">Projeto</h2>
+
+  <nav>
+    <ul class="flex flex-col gap-6">
+      <li>
+        <a class="flex gap-2 items-center font-medium text-lg" href="#" aria-label="Resumo do projeto">
+          <img src="/img/icon-project-summary.svg" class="" alt="">
+          <span>Resumo do Projeto</span>
+        </a>
+      </li>
+      <li>
+
+        <a class="flex gap-2 items-center font-medium text-lg" href="#">
+          <img src="/img/icon-project-summary.svg" alt="">
+          <span>Documentos</span>
+        </a>
+      </li>
+      <li>
+        <a class="flex gap-2 items-center font-medium text-lg" href="#">
+          <img src="/img/icon-members.svg" alt="">
+          <span>Membros da Equipe</span>
+        </a>
+      </li>
+    </ul>
+  </nav>
+
+</aside>
\ No newline at end of file
diff --git a/resources/views/pages/tasks/index.blade.php b/resources/views/pages/tasks/index.blade.php
index 7da77c7..6ed8a80 100644
--- a/resources/views/pages/tasks/index.blade.php
+++ b/resources/views/pages/tasks/index.blade.php
@@ -1,82 +1,73 @@
-@extends('layout.layout')
+@extends('layout.core.layout')
 
 @section('content')
-<div class="row">
-    <div class="col-md-12">     
-        <nav aria-label="breadcrumb">
-            <ol class="breadcrumb mt-5" style="color: #50bcb3;">
-                <li class="breadcrumb-item"><a href="/" style="color: #50bcb3;">Home</a></li>
-                <li class="breadcrumb-item"><a href="{{ route('developers.index') }}" style="color: #50bcb3;">Developer</a></li>
-                <li class="breadcrumb-item active" aria-current="page"><a href="{{ route('projects.index') }}" style="color: #50bcb3;">Project</a></li>
-                <li class="breadcrumb-item"><a href="{{ route('tasks.index') }}" style="color: #50bcb3;">Task</a></li>
-                <li class="breadcrumb-item"><a href="{{ route('feedbacks.index') }}" style="color: #50bcb3;">Feedback</a></li>
-            </ol>
-        </nav>
-        <h2 class="mt-5 mb-5" style="color: #50bcb3;">
-            Tasks
-        </h2>              
-        <div class="card">
-            <div class="card-header bg-blue" style="background-color: #50bcb3;">
-                <h4 class="mb-0 text-black">Tasks</h4>
-            </div>
-            <div class="card-body">
-                <div class="table-responsive">
-                    <table class="table table-bordered table-lg">
-                        <thead>
-                            <tr>
-                                <th scope="col" style="color: #50bcb3;">ID</th>
-                                <th scope="col" style="color: #50bcb3;">Name</th>
-                                <th scope="col" style="color: #50bcb3;">Description</th>
-                                <th scope="col" style="color: #50bcb3;">Comments</th>
-                                <th scope="col" style="color: #50bcb3;">Sprint</th>
-                                <th scope="col" style="color: #50bcb3;">Priority</th>
-                                <th scope="col" style="color: #50bcb3;">Status</th>
-                                <th scope="col" style="color: #50bcb3;">Developer</th>
-                                <th scope="col" style="color: #50bcb3;">Project</th>
-                                <th scope="col" style="color: #50bcb3;">Actions</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            @foreach($tasks as $task)
-                            <tr>
-                                <td>{{ $task->id }}</td>
-                                <td>{{ $task->name }}</td>
-                                <td>{{ $task->description }}</td>
-                                <td>{{ $task->comments }}</td>
-                                <td>{{ $task->sprint->format('d/m/Y') }}</td>
-                                <td>{{ $task->priority }}</td>
-                                <td>{{ $task->status }}</td>
-                                <td>{{ $task->developer ? $task->developer->name : 'N/A' }}</td>
-                                <td>{{ $task->project ? $task->project->name : 'N/A' }}</td>
-                                <td>
-                                    <div class="btn-group">
-                                        @can('update', $task)
-                                        <a href="{{ route('tasks.edit', $task->id) }}" class="btn btn-primary btn-sm square-btn"><i class="material-icons">edit</i></a>
-                                        @endcan
-                                        <form action="{{ route('tasks.destroy', $task->id) }}" method="POST" style="display: inline;">
-                                            @csrf
-                                            @method('DELETE')
-                                            @can('delete', $task)
-                                            <button type="submit" class="btn btn-danger btn-sm square-btn"><i class="material-icons">delete</i></button>
-                                            @endcan 
-                                        </form>
-                                    </div>
-                                </td>
-                            </tr>
-                            @endforeach
-                        </tbody>
-                    </table>
-                </div>
-                <div class="d-flex justify-content-center">
-                    {{ $tasks->links() }}
-                </div>
-                @can('create', App\Models\Task::class)
-                <div class="mt-3">
-                    <a href="{{ route('tasks.create') }}" class="btn btn-secondary" style="background-color: #50bcb3;">Create</a>
-                </div>
-                @endcan
-            </div>
+<section>
+    <nav>
+        <ul class="text-main-400 flex gap-4">
+            <li><a href="/" class="text-main-400">Home</a></li>
+            <li><a href="{{ route('developers.index') }}" class="text-main-400">Developer</a></li>
+            <li><a href="{{ route('projects.index') }}" class="text-main-400">Project</a></li>
+            <li><a href="{{ route('tasks.index') }}" class="text-main-400">Task</a></li>
+            <li><a href="{{ route('feedbacks.index') }}" class="text-main-400">Feedback</a></li>
+        </ul>
+    </nav>
+
+    <div>
+        <h3 class="bg-main-400">Tasks</h3>
+
+        <table class="block max-w-full overflow-x-scroll">
+            <thead>
+                <tr class="w-full">
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">ID</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Name</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Description</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Comments</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Sprint</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Priority</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Status</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Developer</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Project</th>
+                    <th class="min-w-[250px] text-main-400 text-left" scope="col">Actions</th>
+                </tr>
+            </thead>
+            <tbody>
+                @foreach($tasks as $task)
+                <tr>
+                    <td>{{ $task->id }}</td>
+                    <td>{{ $task->name }}</td>
+                    <td>{{ $task->description }}</td>
+                    <td>{{ $task->comments }}</td>
+                    <td>{{ $task->sprint->format('d/m/Y') }}</td>
+                    <td>{{ $task->priority }}</td>
+                    <td>{{ $task->status }}</td>
+                    <td>{{ $task->developer ? $task->developer->name : 'N/A' }}</td>
+                    <td>{{ $task->project ? $task->project->name : 'N/A' }}</td>
+                    <td>
+                        <div>
+                            @can('update', $task)
+                            <a href="{{ route('tasks.edit', $task->id) }}">edit</a>
+                            @endcan
+                            <form action="{{ route('tasks.destroy', $task->id) }}" method="POST" style="display: inline;">
+                                @csrf
+                                @method('DELETE')
+                                @can('delete', $task)
+                                <button type="submit">delete</button>
+                                @endcan
+                            </form>
+                        </div>
+                    </td>
+                </tr>
+                @endforeach
+            </tbody>
+        </table>
+
+        <div>{{ $tasks->links() }}</div>
+
+        @can('create', App\Models\Task::class)
+        <div class="mt-3">
+            <a href="{{ route('tasks.create') }}" class="bg-main-400">Create</a>
         </div>
+        @endcan
     </div>
-</div>
-@endsection
+</section>
+@endsection
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index ca9f758..aec6e04 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -20,6 +20,11 @@ export default {
             screens: {
                 "custom-xl": "1200px",
             },
+            colors: {
+                main: {
+                    400: "#4EA2A5",
+                },
+            },
         },
     },
     plugins: [],