diff --git a/Site Web/client/src/components/Log/index.js b/Site Web/client/src/components/Log/index.js
index 828ba032..b42c1c00 100644
--- a/Site Web/client/src/components/Log/index.js	
+++ b/Site Web/client/src/components/Log/index.js	
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import Connexion from './Connexion';
 import Inscription from './Inscription';
+import Logo from '../../assets/img/logo.png';
 
 const Log = ( props ) => {
     const [signUpModal, setSignUpModal] = useState(props.signup);
@@ -18,6 +19,12 @@ const Log = ( props ) => {
     
     return (
         <div className="connection-form">
+            <div className='form-presentation'>
+                <img src={Logo} alt='Favor'/>
+                <p>Bienvenue!</p>
+                <p>"Comment découvrir et partager des sites et des ressources sur internet de manière plus efficace et personnalisée ?"</p>
+                <p></p>
+            </div>
             <div className="form-container">
                 <div className="info-form-container">
                     <ul className='ul-profil'>
diff --git a/Site Web/client/src/styles/pages/_homenavigation.scss b/Site Web/client/src/styles/pages/_homenavigation.scss
index 88f06bd8..52a264f8 100644
--- a/Site Web/client/src/styles/pages/_homenavigation.scss	
+++ b/Site Web/client/src/styles/pages/_homenavigation.scss	
@@ -52,7 +52,7 @@
     flex-direction: row-reverse;
     justify-content: center;
     padding-top: 4%;
-
+    padding-left: 400px;
 }
 
 
@@ -171,3 +171,18 @@ input[type="submit"]:hover, .buttonTEL:hover{
   visibility: hidden;
 }
 */
+
+
+.form-presentation{
+  width: 400px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: 100%;
+  position: fixed;
+  border-right: 2px solid black;
+  border-radius: 5px;
+  p{
+    padding-top: 10%;
+  }
+}