Online tool for generating HTML entities and converting HTML entities to text.

Delimiter Uppercase Padding
HTML
CSS
JavaScript
<div id="converter">
  <div id="textareas">
    <textarea id="input" placeholder="Input"></textarea>
    <textarea id="output" placeholder="Output"></textarea>
  </div>
  <div id="converter-buttons">
    <span>
      <select id="conversion-type">
        <option value="to-ascii">String to HTML entity (ASCII/DEC)</option>
        <option value="to-hex">String to HTML entity (HEX)</option>
        <option value="to-string">HTML entity to String</option>
      </select>
      <button id="convert">Convert</button>
      <input type="checkbox" name="delimiter" checked="checked">Delimiter
      <input type="checkbox" name="uppercase">Uppercase
      <input type="checkbox" name="padding">Padding
    </span>
  </div>
</div>
#converter {
  margin-top: 30px;
}
#textareas {
  display: flex;
  flex-direction: row;
}
#converter textarea {
  width: 50%;
  padding: 5px;
  min-height: 200px;
  font-size: 14px;
  color: #404040;
}
.applet-body {
  border: none !important;
}
#converter-buttons {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}
#convert, #conversion-type {
  font-size: 15px;
  border-radius: 5px;
}
document.querySelector('#convert').onclick = function() {
  const inputMode = document.querySelector('#conversion-type').value;
  let input = document.querySelector('#input').value;
  if (!input) return;

  const uppercase = document.querySelector('input[name="uppercase"]').checked;
  const delimiter = document.querySelector('input[name="delimiter"]').checked;
  const padding = document.querySelector('input[name="padding"]').checked;

  let output = '';

  if (inputMode === 'to-ascii') {
    input.split('').forEach(char => {
       let converted = char.charCodeAt(0) + (delimiter ? ';' : '');
       if (padding) converted = ('0'.repeat(7) + converted).slice(-7);
       output += '&#' + converted;
    });
  } else if (inputMode === 'to-hex') {
    input.split('').forEach(char => {
      const hex = char.charCodeAt(0).toString(16);
      let converted = (uppercase ? hex.toUpperCase() : hex) + (delimiter ? ';' : '');
      if (padding) converted = ('0'.repeat(7) + converted).slice(-7);
      output += '&#x' + converted;
    });
  } else if (inputMode === 'to-string') {
    input.replace(/;/g, '');

    let mode;
    if (input.indexOf('&#x') === 0) {
      input = input.replace(/&#x/g, ' ');
      mode = 'hex';
    } else {
      input = input.replace(/&#/g, ' ');
      mode = 'ascii';
    }

    input.split(' ').forEach(charCode => {
      let decoded;
      if (mode === 'hex') {
        decoded = String.fromCharCode(parseInt(charCode, 16));
      } else {
        decoded = decoded = String.fromCharCode(charCode);
      }
      output += decoded;
    });
  }

  document.querySelector('#output').value = output;
}

document.querySelector('#swap-values').onclick = function() {
  const input = document.querySelector('#input').value;
  const output = document.querySelector('#output').value;
  document.querySelector('#input').value = output;
  document.querySelector('#output').value = input;
}
Tweet this | Share on LinkedIn |