<div class="example">
<input type="text" id="texto"
 placeholder="Texto..." onkeyup="encriptar(this.value)">
<input type="text"  id="resultado" placeholder="Resultado..." disabled>
</div>
.example{
  display:flex;
  flex-direction:column;
  max-width:300px;
  margin:auto;
  gap:20px;
}
.example input{
  padding:10px;
}
const encriptar = function(value){
  const result =  CryptoJS.SHA256(value).toString(CryptoJS.enc.Hex);
  document.querySelector('#resultado').value = result;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.2.0/crypto-js.min.js