te dejos este troso de codigo, es la menera mas facil que encontre <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> //obtener el div con el id close para cerrar modal var close=document.getElementById("close") //obtener todo el modal var modal=document.getElementById("modal"); //poner a la ecucha de un click el div con el id close close.addEventListener("click",function(){ modal.style.display="none" }) <!-- language: lang-css --> #modal{ width:100%; height:100vh; display:flex; background:rgba(0,0,0,0.5); justify-content:center; align-items:center; } #modalcontainer{ width:60%; height:70%; background:white; padding:10px; border-radius:10px; } #close{ padding:5px; background:red; color:white; width:auto; font-size:10px; cursor:pointer; } #close:hover{ background:#000; color:white; cursor:pointer; } <!-- language: lang-html --> <div id="modal"> <div id="modalcontainer"> <div id="close"> X </div> <h3>Iniciar sesión</h3> <input type="text" placeholder="Usuario" id="modaluser"> <input type="password" placeholder="Contraseña" id="modalpassword"> <button type="submit">Ingresá</button> </div> <!-- end snippet -->