• HTML
• CSS
• JS

HTML

<div class="contenedor">
    <span>#47ddbb</span>
</div>

CSS

body{
    display:flex;
    justify-content:center;
    align-items:center;
    height:100vh;
    margin:0;
    font-family:sans-serif;
    background:#47ddbb;
    transition:0.3s all;
}
.contenedor{
    text-align:center;
    padding:2em;
    display:flex;
    align-items:stretch;
}
.contenedor span{
    background:#fff;
    padding:0.5em;
    font-size:2em;
    border-radius:0.3em;
}

JS

const btn = document.querySelector('#btn');

function generarColores(){
   
    let char  = '0123456789abcdef';
    let color = '#';
    
    for(let i=0; i<6; i++){
        color = color + char[Math.floor(Math.random()*16)];
    }
    
    document.querySelector('span').innerHTML = color;
    document.body.style.background = color;
    
}

setInterval(generarColores,3000);