Web-Highlighter (Google Chrome Extension)

Web higlighter is an extension for chrome that helps you highlight words, phrases or chunks of text. You can add descriptions, translation or any kind of details to the highlights. Everytime you find a word on the web that you saved in your database it will be highlighted with their respective details, descriptions or details.

Live Demo

Technologies used to develop this extension

• Javascript (ES6)
• Markjs library for highlights
• Chrome Storage, Tabs ContextMenu APIs
• Web Intersection Observer, MutationObserver APIs
• CSS
• HTML

Steps to install it

1. First download or clone the repository
2. Go to chrome://extensions in google chrome
3. Click on load unpacked
4. Select the directory or repository you downloaded

How to use it

1. Once installed go to any page.
2. Select text on any page
3. Right click to open the context menu and click on Highlight text: "%s"
4. A menu will open in which it will show the text that will be highlighted and the description or definition you wanna add
5. Click on save to highlight it and stored in database
6. Everytime you encounter the word it will be lighlighted with its respective definition, description or none because it's optional

Method 1 to highlight

Method 2 to highlight