Free Online Glitch Text Generator - Creepy Zalgo Converter

Technical Specification: Web-Based Glitch Text Generator

Overview

A high-performance, single-page application (SPA) that allows users to transform plain text into corrupted, 'glitched' Unicode text. The application focuses on low-latency rendering, providing real-time feedback as users adjust corruption levels.

Design Language & UI

• Theme: Cyberpunk-inspired aesthetic featuring a high-contrast dark mode.
• Color Palette: Background (#0A0A0A), Text (#E0E0E0), Accent (Cyber Green #00FF41, Glitch Purple #BF00FF).
• Animations: Subtle CRT scanline CSS overlay, glitch-text hover effects on buttons, and a 'shaking' animation when the corruption intensity is set to maximum.
• Typography: A mix of a clean monospace font (e.g., 'Courier Prime') for the input and a heavy, jagged font for the title to establish a creepy, tech-focused atmosphere.

Layout Structure

1. Header: Clean title with a toggle for dark/light mode.
2. Input Section: A large textarea for raw text input.
3. Control Panel:
   • Intensity Slider: Adjusts the volume of combining diacritical marks.
   • Direction Controls: Toggles for 'Up', 'Down', and 'Middle' stack orientation.
   • Mode Selector: Presets for 'Subtle', 'Aggressive', 'Void' (Maximum intensity).
4. Output Section: A read-only display area with a 'Copy to Clipboard' button.
5. History Bar: A small horizontal scrollable area showing the last 5 generated text strings.

Interactive Features

• Real-Time Rendering: The output updates instantly via a keyup event listener as the user types.
• Smart Clipboard: A 'One-Click Copy' button that provides visual feedback (e.g., button glows green on success).
• Character Counter: Displays the length of the string, including hidden Unicode characters, to warn users about platform limits.
• Scramble Mode: A button that randomly shuffles the order of characters while maintaining the glitch effect.
• Download as Image: An advanced feature using the HTML5 Canvas API to render the glitch text as an image for use in graphics design.

Technical Stack

• Frontend: Vanilla JavaScript (ES6+), HTML5, and CSS3 (Flexbox/Grid).
• Performance: Efficient DOM manipulation to handle heavy character stacking without triggering browser reflow lag.
• Cross-Platform Compatibility: Sanitization logic to ensure that generated text maintains maximum compatibility across Twitter, Discord, and messaging apps.