Zalgo

He Comes

by Joel Kirchartz

HTML

<h1>Zalgo Text Generator</h1>
<p>HE COMES</p>
<textarea id="in"></textarea>
<div>
<button id="change">re-generate</button>
</div>
<div id="out"></div>

CSS

body { font:1em/1.5 sans-serif;
    background:#FAA;
}

h1 { font-size:3em; font-weight:900; font-family: sans-serif;
     background:#933; text-align:center;
     box-shadow:-0.1em 0.1em 0em 0.1em #311;
    color:#ccc;
    padding:0.25em;
}
p { padding:1em; }
textarea { display:block; width:98%; min-height:2em; margin:0 auto; }

button {
     display:inline-block;
     font-size:1.5em;
    font-weight:900;
     border-radius:0.2em;
     background:#FAA;
     border: 0.05em solid #933;
     box-shadow:0.18em 0.18em 0em 0em #311;
     margin:0.5em;    
}
button:hover {
    background:#F88;
     box-shadow:0.1em 0.1em 0em 0em #311;   
}
button:active {
    background:#FDD;
    box-shadow:0.05em 0.05em 0em 0em #311;
}
#out {
   font-size:2em;
   font-weight:600;    
   padding:0.25em;
}

JavaScript

var Z = {
    chars: {
        0 : [ /* up */
    '\u030d', /*     ̍     */
    '\u030e', /*     ̎     */
    '\u0304', /*     ̄     */
    '\u0305', /*     ̅     */
    '\u033f', /*     ̿     */
    '\u0311', /*     ̑     */
    '\u0306', /*     ̆     */
    '\u0310', /*     ̐     */
    '\u0352', /*     ͒     */
    '\u0357', /*     ͗     */
    '\u0351', /*     ͑     */
    '\u0307', /*     ̇     */
    '\u0308', /*     ̈     */
    '\u030a', /*     ̊     */
    '\u0342', /*     ͂     */
    '\u0343', /*     ̓     */
    '\u0344', /*     ̈́     */
    '\u034a', /*     ͊     */
    '\u034b', /*     ͋     */
    '\u034c', /*     ͌     */
    '\u0303', /*     ̃     */
    '\u0302', /*     ̂     */
    '\u030c', /*     ̌     */
    '\u0350', /*     ͐     */
    '\u0300', /*     ̀     */
    '\u0301', /*     ́     */
    '\u030b', /*     ̋     */
    '\u030f', /*     ̏     */
    '\u0312', /*     ̒     */
    '\u0313', /*     ̓     */
    '\u0314', /*     ̔     */
    '\u033d', /*     ̽     */
    '\u0309', /*     ̉     */
    '\u0363', /*     ͣ     */
    '\u0364', /*     ͤ     */
    '\u0365', /*     ͥ     */
    '\u0366', /*     ͦ     */
    '\u0367', /*     ͧ     */
    '\u0368', /*     ͨ     */
    '\u0369', /*     ͩ     */
    '\u036a', /*     ͪ     */
    '\u036b', /*     ͫ     */
    '\u036c', /*     ͬ     */
    '\u036d', /*     ͭ     */
    '\u036e', /*     ͮ     */
    '\u036f', /*     ͯ     */
    '\u033e', /*     ̾     */
    '\u035b', /*     ͛     */
    '\u0346', /*     ͆     */
    '\u031a'  /*     ̚     */
    ],
    1 : [ /* down */
    '\u0316', /*     ̖     */
    '\u0317', /*     ̗     */
    '\u0318', /*     ̘     */
    '\u0319', /*     ̙     */
    '\u031c', /*     ̜     */
    '\u031d', /*     ̝     */
    '\u031e', /*     ̞     */
    '\u031f', /*     ̟     */
    '\u0320', /*     ̠     */
    '\u0324', /*     ̤     */
    '\u0325', /*     ̥     */
    '\u0326', /*     ̦     */
    '\u0329', /*     ̩     */
    '\u032a', /*     ̪     */
  ...