Hybrid AI Text Simplifier

A powerful Chrome extension to summarize and simplify selected text using either a privacy-first, on-device AI model or the advanced Google Gemini API.

Overview

In an age of information overload, this extension helps you quickly grasp the essence of dense articles, technical documents, or any complex text you encounter online. With a simple right-click, you get a concise, easy-to-understand summary presented in a sleek, non-intrusive interface.

What makes this extension unique is its hybrid approach. You have the power to choose your AI engine:

1. Local On-Device Model (Gemini Nano): For ultimate privacy and offline use. Your selected text never leaves your computer.
2. Google Gemini API (Cloud): For maximum power and comprehension, leveraging Google's state-of-the-art models.

Key Features

• Hybrid AI Engine: Seamlessly switch between a local AI and the cloud-based Gemini API.
• Privacy-First: The local model option ensures your data remains completely private.
• Offline Capability: The local model works even without an internet connection once downloaded.
• Intuitive UI: Summaries appear in a modern, floating card that doesn't interrupt your workflow.
• Markdown Rendering: AI responses are beautifully formatted with lists, bold text, and proper paragraphs.
• Customizable Themes: Choose between Light, Dark, or a theme that follows your system's settings.
• Configurable Settings: An easy-to-use options page to manage your model preference and API key.

Installation & Setup

To get the extension running locally for development, follow these steps:

1. Clone the Repository

git clone https://github.com/NishaantKrSingh/text-summarization-chrome-extension.git
cd text-summarization-chrome-extension

2. Load the Extension in Chrome

1. Open Chrome and navigate to chrome://extensions.
2. Enable "Developer mode" using the toggle in the top-right corner.
3. Click the "Load unpacked" button.
4. Select the text-summarization-chrome-extension folder that you just cloned.

3. Configure the Extension

1. Pin the extension to your toolbar for easy access.
2. Click the extension icon, then click "Open Settings" (or right-click the icon and choose "Options").
3. To use the Gemini API:
   • Get your API key from Google AI Studio.
   • In the settings page, select the "Gemini API (Cloud)" option.
   • Paste your API key into the input field and click "Save Settings".
4. To use the Local Model (Experimental):
   • This requires Chrome 127+ and enabling specific flags.
   • Navigate to chrome://flags.
   • Search for and Enable the following flags:
     • #prompt-api-for-gemini-nano
     • #enables-optimization-guide-on-device
   • Click "Relaunch" to restart Chrome.
   • In the settings page, you should now see the status of the local model. If it's "downloadable", click the "Download" button.

How to Use

1. Select Text: Highlight any text on a webpage.
2. Right-Click: Open the context menu.
3. Summarize: Click the "Summarize Text" option.
4. View Result: A card will slide in from the top-right corner, first showing a loading indicator and then displaying the formatted summary.

Technology Stack

• Platform: Chrome Extension Manifest V3
• Languages: JavaScript (ES6+), HTML5, CSS3
• Core APIs:
  • Chrome Extension APIs (storage, contextMenus, scripting)
  • Local AI: Built-in Chrome LanguageModel API (Project Gemini Nano)
  • Cloud AI: Google Gemini API (gemini-1.5-flash)
• Libraries:
  • marked.js: For fast Markdown-to-HTML conversion.
  • DOMPurify: For sanitizing HTML and preventing XSS vulnerabilities.

📂 Project Structure

.
├── background.js         # Service worker: handles context menu, API calls, and core logic.
├── content.js            # Injects the summary card UI and styles into web pages.
├── manifest.json         # Extension configuration file.
├── options.html          # The UI for the settings page.
├── options.js            # Logic for the settings page (saving keys, choosing models, etc.).
├── popup.html            # The UI for the small popup when clicking the extension icon.
├── popup.js              # Logic for the popup (e.g., button to open options).
├── marked.min.js         # The Marked library for Markdown parsing.
├── purify.min.js         # The DOMPurify library for HTML sanitization.
├── icon.png              # Extension icon.
└── README.md             # You are here!

🤝 Contributing & Future Ideas

Contributions are welcome! Feel free to open an issue or submit a pull request.

Here are some ideas I currently have for future improvements:

• Allow users to customize the AI prompt from the settings page.
• Add a "Copy to Clipboard" button for the summary text.
• Implement a keyboard shortcut for summarizing.
• Add support for other AI models (e.g., Claude, Llama).
• Add a history of recently summarized texts.