Input Character Counter

WHAT IT DOES

Input Character Counter adds real-time character and word counters to every text input and textarea on the page. As you type, the counter updates instantly showing the current character count and, if present, the maximum allowed length. When you're approaching the limit, the counter changes color from gray to yellow (warning) and red (exceeded). The tool also counts words, showing the number of words alongside the character count. You can set a custom global maximum length that applies to all fields, or the tool will respect the maxlength attribute on individual inputs. The counter works with dynamically added fields and supports both left and right alignment.

WHERE IT RUNS

The extension runs entirely within your browser's local environment using the BotGentz framework. All text counting, input detection, and DOM manipulation occur on your machine without any network requests. No text content, count data, or user activity is ever transmitted, uploaded, or stored externally. The tool works on any website and respects the browser's security boundaries, operating within the isolated extension sandbox. Text counting uses the browser's native string length and word splitting functions.

HOW TO USE

Click the extension toolbar icon to open the Input Character Counter panel. The tool works automatically—counters appear under every text input and textarea on the page. Each counter shows the character count (e.g., "45 / 200") and word count (e.g., "8 words"). Click "Refresh Counters" to update all counter displays. Click "Re-scan Inputs" to detect any new input fields added to the page. Toggle "Show counters" to show or hide all counters. Toggle "Include word count" to enable or disable the word count display. Change the "Counter position" between Bottom Right and Bottom Left. Adjust the "Warning threshold" (50-95%) to control when the counter turns yellow. Set a "Global max length" (0 = off) to apply a custom limit to all fields without a maxlength attribute. The panel provides clear controls for all settings.

THE CHARACTER COUNTER ENGINE — WHY IT WORKS

Most character counters only display the count without providing visual feedback or word counting. This tool uses a comprehensive approach: it scans the page for all input and textarea elements, excluding password and hidden fields. For each input, it creates a counter container positioned below the field with two spans—one for characters and one for words. The character count is calculated using the string's length property. The word count splits the trimmed text by whitespace and counts the resulting array. The maximum length is determined by reading the maxlength attribute, falling back to the custom global limit. The warning and error states are triggered by percentage thresholds: when the count exceeds the warning threshold (default 80%), the color changes to yellow; when it reaches or exceeds 100%, it turns red. The input border also changes color to provide additional visual feedback. The tool uses input event listeners for real-time updates, and a MutationObserver detects dynamically added inputs to apply counters automatically.

THE PANEL

The Input Character Counter panel is fully draggable by its title bar and remembers its position on screen per website. It snaps to the edges of your browser window for clean alignment. Collapse the panel to a compact icon strip using the minimize button, restoring it with a single click. Resize the panel by dragging any edge or corner; the settings and controls adjust proportionally. Press the Escape key to close the panel instantly. The panel maintains independent state for each browser tab, allowing you to manage counters in multiple tabs simultaneously.

PLEASE NOTE

This extension requires the free BotGentz extension framework to be installed and enabled. The tool works with standard text inputs and textareas; rich text editors, contenteditable elements, and custom input components are not supported. The word count may vary depending on how whitespace and punctuation are handled. The tool uses maxlength detection; some frameworks may set maxlength in JavaScript after page load. All text data is processed locally and is never transmitted, logged, or shared. The extension requests no network permissions and functions entirely offline. The source code is fully auditable and available for review.