JSFiddle - React, Tailwind, and code Playground

HTML

Encoded: <br...

CSS

html, body { height:100%; }
textarea   { width:99%; height:35%; }
input      { width:2em; text-align:center; 
             border:1px solid #fedfdf; background:#f7f7f7; }

JavaScript

var dencode=function(opt){
    var L = document,    enc = [],    dec = [],
        i = L.getElementsByTagName('input'),
      rad = Number(i[0].value) || 10,
      sep = i[1].value || ',',
      ofs = Number(i[2].value) || 0,
      txt = L.getElementsByTagName('textarea');

    if (opt === 'enc') {                        // encode
        dec = txt[1].value.split('');
        for (i = 0, L = dec.length; i < L; i++) {
            enc.push( (dec[i].charCodeAt(0)-ofs).toString(rad) );
        }
        txt[0].value = enc.join(sep);
    } else {                                    // decode (default)
        enc = txt[0].value.replace(/[\r\n]/gi,'').split(sep);
        for (i = 0, L = enc.length; i < L; i++) {
            dec.push(  String.fromCharCode( parseInt(enc[i],rad)+ofs )  );
        }
        txt[1].value = dec.join('');
    }
};