diff --git a/src/components/NavigationDashboard.js b/src/components/NavigationDashboard.js
index 4a0f85a..b5d78fa 100644
--- a/src/components/NavigationDashboard.js
+++ b/src/components/NavigationDashboard.js
@@ -8,7 +8,7 @@ const NavigationDashboard = () => {
             <NavLink className="mon_compte" to="/Account">
                 <div className="parti_one">
                     <button className="button" type="submit">
-                        <img id='bigImage' className="logo_nav_bar" srcSet="./logo_person.svg"/>                       
+                        <img className="logo_nav_bar" srcSet="./logo_person.svg"/>                       
                     </button>
                 </div>
             </NavLink>
diff --git a/src/pages/Compte.js b/src/pages/Compte.js
index 3ac2607..12fc9cd 100644
--- a/src/pages/Compte.js
+++ b/src/pages/Compte.js
@@ -2,6 +2,7 @@ import React from 'react';
 import NavigationDashboard from '../components/NavigationDashboard';
 
 
+
 const Compte = () => {
     return (
         <body>
@@ -27,9 +28,9 @@ const Compte = () => {
                     <div className="Compte">
                         <div className="name_picture">
                             <div className="picture">
-                                <img className="photo_profil" srcSet="./logo_personEntouré.svg"/>
+                                <div id="display_image"></div>
                                 <div className='bouton_submit'>
-                                    <button className="bouton_ajoutPhoto" type="submit">Ajouter une photo</button>
+                                    <input type="file" name="fileUpload" id="fileUpload"/>
                                 </div>
                             </div>
                             <div className="name">
@@ -75,8 +76,34 @@ const Compte = () => {
                     </div>
                 </div>
             </div>
+            <script src="Compte.js" defer></script>
         </body>
     );
 };
 
+let fileUpload = document.getElementById("fileUpload");
+let display_image = document.getElementById("display_image");
+
+preview();
+
+function preview(){
+    display_image.innerHTML = "";
+
+    for(fileUpload of fileUpload.files){
+        let reader = new FileReader();
+        let figure = document.createElement("figure");
+        let figCap = document.createElement("figcaption");
+        figCap.innerText = fileUpload.name;
+        figure.appendChild(figCap);
+        reader.onload=()=>{
+            let img = document.createElement("img");
+            img.setAttribute("src", reader.result);
+            figure.insertBefore(img,figCap);
+        }
+        display_image.appendChild(figure);
+        reader.readAsDataURL(fileUpload);
+    }
+}
+
+
 export default Compte;
\ No newline at end of file
diff --git a/src/pages/Parametres.js b/src/pages/Parametres.js
index 3f10057..937f8f1 100644
--- a/src/pages/Parametres.js
+++ b/src/pages/Parametres.js
@@ -43,7 +43,15 @@ const Parametre = () => {
                             </div>
                         </div>
                         <div className="two">
-                            coucou
+                            <div className="two_haut">
+                                coucou
+                            </div>
+                            <div className="two_bas">
+                                <p className="text_two_bas">Mode sombre</p>
+                                <div className="center">
+                                    <input type="checkbox" name=''/>
+                                </div>
+                            </div>
                         </div>
                         <div className="three">
                             coucou
diff --git a/src/styles/components/_compte.scss b/src/styles/components/_compte.scss
index 9f6cd4c..1dee73e 100644
--- a/src/styles/components/_compte.scss
+++ b/src/styles/components/_compte.scss
@@ -162,11 +162,26 @@ body {
                         margin-left: 25px;
                         border-bottom: 1px solid grey;
 
-                        .photo_profil {
+                        #display_image {
                             display: flex;
+                            margin-bottom: 5px;
                             height: 135px;
                             width: 135px;
+                            background: rgba(255, 255, 255, 0.1);
+                            border-radius: 15px;
+                            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+                            backdrop-filter: blur(3px);
+                            -webkit-backdrop-filter: blur(15px);
                         }
+                        
+                        .figure{
+                            width: 45%;
+                        }
+        
+                        .img{
+                            width: 100%;
+                        }
+                        
 
                         .bouton_submit {
                             display: flex;
@@ -231,6 +246,7 @@ body {
                     }
                 }
 
+
                 .infoPerso {
                     display: flex;
                     flex-direction: column;
diff --git a/src/styles/components/_parametre.scss b/src/styles/components/_parametre.scss
index 7e47492..da2cf82 100644
--- a/src/styles/components/_parametre.scss
+++ b/src/styles/components/_parametre.scss
@@ -218,8 +218,11 @@ body {
 
                 .two {
                     display: flex;
+                    flex-direction: column;
+                    justify-content: space-between;
                     width: auto;
                     height: 28.5%;
+                    padding: 10px;
 
                     background: rgba(255, 255, 255, 0.3);
                     border-radius: 15px;
@@ -227,6 +230,18 @@ body {
                     backdrop-filter: blur(3px);
                     -webkit-backdrop-filter: blur(15px);
 
+                    .two_haut {
+                        display: flex;
+                        height: 75%;
+                    }
+
+                    .two_bas {
+                        display: flex;
+                        flex-direction: row;
+                        padding: 9px;
+                        height: 25%;
+
+                    }
                 }
 
                 .three {
