Anbani TextArt

Generate Georgian and Latin TextArts with ease!

by georgegach

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Anbani TextArt Demo</title>
  <!-- Copy this line below in your HTML file to use Anbani/TextArt -->
  <script src="https://cdn.jsdelivr.net/gh/Anbani/TextArt@main/dist/TextArt.js"></script>
  <style>
    html, body {
      background-color: #334155;
      color: #94a3b8;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      height:100%;
    }
    pre {
      line-height: 1.30em;
      letter-spacing: 0.07em;
    }
  </style>
</head>
<body>
  <input type="text" name="" placeholder="Enter text here..."  id="inputarea">
  <br/><br/>
  <pre id="art"></pre>

    <script>
        window.onload = () => {
            document.querySelector('#art')
            
            const artarea = document.querySelector('#art')
            artarea.textContent = window['anbani-textart'].generate('Anbani Block Regular', 'გამარჯობა')
            
            document.querySelector("#inputarea").addEventListener("input", (event) =>{
            	artarea.textContent = window['anbani-textart'].generate(
                  'Anbani Block Regular', 
                  event.target.value || ' '
              )
            })
        }
    </script>
</body>
</html>