This app runs inside the BotSurf browser. Don't have it yet? Get the app or extension now!

Grammar Highlight Overlay Prompt

Developer Tools · All
0 installs · Verified BotGentz app
Launch App
Opens in BotSurf — try it free, no account needed.
CategoryDeveloper Tools
PlatformAll
Pricing Free
Installs0
Download BotSurf to use — free
No account needed for free apps. Once BotSurf is open, find this app in Apps from the + menu.

About this app

WHAT IT DOES Grammar Highlight Overlay Prompt adds a color-coded grammar overlay to any webpage, helping users understand sentence structure by visually distinguishing parts of speech. Nouns appear in blue, verbs in red, adjectives in green, and adverbs in orange (colors are fully customizable). You can choose from four annotation styles: highlight background, underline, dotted underline, or side annotations with part-of-speech labels (N, V, Adj, Adv). This is an invaluable tool for language learners, educators, students, and anyone who wants to analyze text structure more deeply. The overlay updates dynamically as you scroll or when page content changes, and a legend at the bottom of the page explains the color scheme. WHERE IT RUNS The extension works on every website with text content, including news sites, blogs, academic articles, documentation pages, language learning platforms, and any other page with English text. It runs locally in your browser, processing text and applying highlights without sending any data to external servers. The extension supports all major browsers and adapts to both desktop and mobile viewports seamlessly. HOW TO USE After installation, the extension automatically highlights parts of speech on the page using the default color theme and highlight style. To disable highlighting, open the extension panel and toggle off the "Enable Grammar Highlighting" switch. To customize the appearance, select a color theme (Default, High Contrast, Pastel, or Dark) and click "Apply Theme." Choose an annotation style: Highlight background, Underline, Dotted underline, or Side annotations (shows N, V, Adj, Adv tags next to each word). Adjust opacity (0.2 to 1.0) and tag size (0.5 to 1.5) for better readability. For per-site customization, enable or disable the extension on specific websites using the per-site controls. Click "Refresh Highlights" to re-scan the page after content changes, or "Remove Highlights" to clear all annotations. THE ACTUAL MECHANISM — WORD LIST-BASED PART OF SPEECH DETECTION WITH IN-PLACE DOM ANNOTATION The extension uses a curated word list approach for part-of-speech detection. It maintains four arrays for nouns, verbs, adjectives, and adverbs, each containing over 100 common English words. When scanning the page, the extension uses a TreeWalker to traverse all text nodes within the main content area. For each text node, it splits the text by whitespace and checks each word against the POS lists using a lowercased comparison. If a match is found, the word is wrapped in a `` element with inline styles applied based on the selected annotation style and color theme. For highlight mode, a semi-transparent background color is applied using `background-color: [color]40`. For underline and dotted modes, `text-decoration` properties are used with the selected color. For side annotation mode, the extension inserts a small tag (N, V, Adj, Adv) as a superscript or inline element next to the word. The extension maintains a WeakMap to track original text content and a WeakSet to avoid re-processing already annotated nodes. When content changes, a MutationObserver triggers a re-scan and re-annotation of affected areas. A legend at the bottom of the page displays the current color scheme, built from the active theme's color values. THE PANEL The settings panel is a lightweight, draggable overlay that appears in the center of your screen. You can reposition it by clicking and dragging the title bar; release it near the screen edge and it will snap into place automatically. To collapse the panel into a compact title bar, click the minimize button, expanding it again with the same control. The panel is fully responsive, adapting to different screen resolutions with a minimum width of 300px and a maximum of 480px. Press the Escape key at any time to dismiss the panel without applying changes. All controls—the enable/disable toggle, refresh and remove buttons, color theme selector, annotation style selector, opacity slider, tag size slider, and per-site controls—are accessible within a clean, high-contrast interface that respects your system's color scheme. PLEASE NOTE This extension requires the free BotGentz companion extension to be installed and active, which provides the underlying DOM access and storage engine. The part-of-speech detection uses a curated word list and may not identify every word correctly, especially for words that can function as multiple parts of speech (e.g., "run" as a verb or noun). The extension is designed for educational and language learning purposes and should not be used as a definitive grammatical analysis tool. No personal data, browsing history, or text content is ever collected, stored, or transmitted. All settings are saved using the browser's storage API and remain solely on your device. The extension does not inject ads, trackers, or analytics of any kind.

Similar Apps

Log in to BotGentz

Suggest an App

Tell us what you'd find useful — if we build it, we'll email you the moment it's ready.