⭐ Love Clarity? Star us on GitHub to support development and help others discover it!

In today’s digital world, people constantly consume information — articles, research papers, blogs, documentation — yet most reading remains passive.
Important insights are lost in endless tabs, and copying text for notes or summaries is tedious.
Students, researchers, and professionals alike struggle to retain, organize, and make sense of what they read online.

Theme — Utility:
Clarity was built to solve this everyday challenge by turning any webpage into an interactive, active-learning workspace.
It empowers users to summarize, translate, highlight, and take notes instantly — all from a single contextual menu.
No switching tabs, no messy note-taking apps — just clarity, right where you read.

Clarity turns passive reading into active learning — directly on any webpage.
Select text to open a sleek floating menu that helps you:

• ✨ Summarize key ideas
• 🗒️ Generate concise study notes
• 🌐 Translate into your preferred language
• 🎨 Highlight with colors and tags
• 📋 Access and reuse your clipboard history

Everything runs locally: your data stays private, and AI features are powered by a small Node.js server you control.

Select text to reveal an elegant contextual menu with:

• Summarize — concise, AI-generated summaries
• Notes — plain-text study notes
• Translate — instant translation with hover-to-reveal original
• Highlight — color-coded highlighting with tag support
• History — view and copy from your clipboard history

• Automatically stores the last 50 copied items
• Quick copy and clear options
• All data stored locally via chrome.storage.local

• Toggle menu tools individually
• Light/Dark themes
• Default translation language
• Import/Export full extension state

• content.js — injects the menu UI, handles highlights/tags, clipboard reading
• background.js — manages clipboard storage in Chrome local storage
• index.html — popup UI for settings

• Express-based Node.js API for AI operations:
  • /summarize — powered by OpenAI
  • /notes — generates structured study notes
  • /translate — integrates Google Cloud Translate
• .env file holds API keys securely (never embedded in extension)

• Google Chrome (MV3 support)
• Node.js v18+
• API Keys:
  • OPENAI_API_KEY — for summarization and notes
  • GOOGLE_API_KEY — for translation

• Google Chrome (with Manifest V3 support)
• Node.js v18+
• Nodemon (optional, for auto-restart)
• API Keys:
  • OPENAI_API_KEY — for summarization and note generation
  • GOOGLE_API_KEY — for translation features

npm install

Create a .env file in the project root and add your API keys:

OPENAI_API_KEY=your-openai-api-key
GOOGLE_API_KEY=your-google-api-key

nodemon server.js

💡 Alternatively, you can run:

node server.js

if you don’t have Nodemon installed globally.

🧠 Load the Chrome Extension

1. Open Google Chrome

2. Navigate to:

chrome://extensions/

3. Enable Developer Mode (toggle in the top-right corner)

4. Click Load unpacked

5. Select the project’s extension folder — the one containing your manifest.json

6. The Clarity extension will now appear in your Chrome toolbar

✅ Done!

Your Clarity extension and local AI server are now running 🎉 Select any text on a webpage to open the floating action menu and start summarizing, translating, or creating study notes instantly.