Text Styles
viewof input = html`<input value="Type something here!">`
bold = remap("๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐๐๐๐๐๐ ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐")
italic = remap("๐๐๐๐๐๐๐โ๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ๐๐๐๐๐๐๐๐")
boldItalic = remap("๐๐๐๐ ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐")
sansSerif = remap("๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น")
sansSerifBold = remap("๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ")
sansSerifItalic = remap("๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก")
sansSerifBoldItalic = remap("๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐")
script = remap("๐ถ๐ท๐ธ๐นโฏ๐ปโ๐ฝ๐พ๐ฟ๐๐๐๐โด๐ ๐๐๐๐๐๐๐๐๐๐๐โฌ๐๐โฐโฑ๐ขโโ๐ฅ๐ฆโโณ๐ฉ๐ช๐ซ๐ฌโ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต")
scriptBold = remap("๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ")
fraktur = remap("๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐๐ โญ๐๐๐๐โโ๐๐๐๐๐๐๐๐โ๐๐๐๐๐๐๐โจ")
frakturBold = remap("๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ฌ๐ญ๐ฎ๐ฏ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ")
doubleStruck = remap("๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐ช๐ซ๐ธ๐นโ๐ป๐ผ๐ฝ๐พโ๐๐๐๐๐โ๐โโโ๐๐๐๐๐๐๐โค")
monospace = remap("๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐๐๐๐๐๐ ๐๐๐๐")
circled = remap("โโโโโโโโโโโโโโโโโ โกโขโฃโคโฅโฆโงโจโฉโถโทโธโนโบโปโผโฝโพโฟโโโโโโ โโโโโโโโโโ")
negativeCircled = remap("๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ก๐ ข๐ ฃ๐ ค๐ ฅ๐ ฆ๐ ง๐ จ๐ ฉ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ก๐ ข๐ ฃ๐ ค๐ ฅ๐ ฆ๐ ง๐ จ๐ ฉ")
squared = remap("๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ฐ๐ฑ๐ฒ๐ณ๐ด๐ต๐ถ๐ท๐ธ๐น๐บ๐ป๐ผ๐ฝ๐พ๐ฟ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ๐ ")
negativeSquared = remap("๐ ฐ๐ ฑ๐ ฒ๐ ณ๐ ด๐ ต๐ ถ๐ ท๐ ธ๐ น๐ บ๐ ป๐ ผ๐ ฝ๐ พ๐ ฟ๐๐๐๐๐๐ ๐๐๐๐๐ ฐ๐ ฑ๐ ฒ๐ ณ๐ ด๐ ต๐ ถ๐ ท๐ ธ๐ น๐ บ๐ ป๐ ผ๐ ฝ๐ พ๐ ฟ๐๐๐๐๐๐ ๐๐๐๐")
parenthesized = remap("๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐๐ ๐ก๐ข๐ฃ๐ค๐ฅ๐ฆ๐ง๐จ๐ฉ")
fullwidth = remap("๏ผก๏ผข๏ผฃ๏ผค๏ผฅ๏ผฆ๏ผง๏ผจ๏ผฉ๏ผช๏ผซ๏ผฌ๏ผญ๏ผฎ๏ผฏ๏ผฐ๏ผฑ๏ผฒ๏ผณ๏ผด๏ผต๏ผถ๏ผท๏ผธ๏ผน๏ผบ๏ผก๏ผข๏ผฃ๏ผค๏ผฅ๏ผฆ๏ผง๏ผจ๏ผฉ๏ผช๏ผซ๏ผฌ๏ผญ๏ผฎ๏ผฏ๏ผฐ๏ผฑ๏ผฒ๏ผณ๏ผด๏ผต๏ผถ๏ผท๏ผธ๏ผน๏ผบ")
smallCapitals = remap("แดสแดแด แด๊ฐษขสษชแดแดสแดษดแดแดQส๊ฑแดแดแด แดกXสแดขแดสแดแด แด๊ฐษขสษชแดแดสแดษดแดแดQส๊ฑแดแดแด แดกXสแดข")
rot13 = textarea(input.replace(/[a-zA-Z]/g, char => { const A = 65, a = 97; const c = char.charCodeAt(0); const o = c >= a ? a : A; return String.fromCharCode(o + (c - o + 13) % 26); }))
lower = textarea(input.toLowerCase())
upper = textarea(input.toUpperCase())
mixed = textarea(input.replace(/\w/g, c => Math.random() > 0.5 ? c.toUpperCase() : c.toLowerCase()))
function remap(alphabet) { return textarea(replace(input, alphabet)); }
function replace(source, alphabet) { const chars = [...alphabet]; const A = 65, a = 97; return source.replace(/[a-zA-Z]/g, char => { const c = char.charCodeAt(0); const i = (c - (c >= a ? a : A)) + (c >= a ? 0 : 26); return chars[i]; }); }
function textarea(value) { const span = document.createElement("SPAN"); span.className = "output"; span.textContent = value; return span; }
style = html`<style> input, span.output { display: block; box-sizing: border-box; background: transparent; width: calc(100% + 28px) !important; font: var(--mono_fonts); border: none; padding: 6px 10px; margin: 0 -14px; tab-size: 2; resize: none; } input { background: rgb(247,247,249); min-height: 33px; } input:focus { outline: none; } </style>`