Character & Word Counter
Home
Snippets
Character & Word Counter
HTML
CSS
JS
<div class="box"> <textarea id="text" placeholder="Type here..." oninput="count()"></textarea> <div class="info"> Chars: <span id="chars">0</span> | Words: <span id="words">0</span> </div> </div>
body { height: 100vh; margin: 0; font-family: sans-serif; display: flex; justify-content: center; align-items: center; background: #f0f4f8; } .box { background: #ffffff; padding: 12px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); width: 240px; text-align: center; } textarea { width: 100%; height: 80px; font-size: 14px; padding: 6px; border-radius: 6px; border: 1px solid #cccccc; resize: none; box-sizing: border-box; } .info { margin-top: 8px; font-size: 13px; color: #374151; }
function count() { const val = document.getElementById('text').value; document.getElementById('chars').textContent = val.length; document.getElementById('words').textContent = val.trim() ? val.trim().split(/\s+/).length : 0; }
Ad #1
Ad #2
Scroll to Top