The Link Saver Chrome Extension is a browser-based tool built using HTML, CSS, and JavaScript that allows users to save useful links either manually or directly from the currently active browser tab.
All saved links are stored locally and persist across browser sessions.
This project demonstrates practical usage of Chrome Extension APIs and client-side storage.
- Save links by entering them manually
- Save the URL of the currently active browser tab
- Display saved links as clickable items
- Persist data using browser localStorage
- Delete all saved links with a single click
- Simple and clean user interface
- HTML – Structure of the extension popup
- CSS – Styling and layout
- JavaScript – Core logic and functionality
- Chrome Extension API – Access active browser tabs
- localStorage – Persistent data storage
- Manifest Version: v3
├── chrome.html # Popup UI
├── chrome.css # Styling
├── chrome.js # Extension logic
├── manifest.json # Chrome extension configuration
├── image.png # Extension icon
- Users can input a URL and save it using the SAVE INPUT button.
- The SAVE TAB button captures the URL of the currently active browser tab using the Chrome Tabs API.
- Saved links are displayed dynamically as clickable list items.
- All data is stored in the browser’s localStorage to maintain persistence.
- The DELETE ALL button clears all stored links.
-
Clone or download this repository:
git clone https://github.com/your-username/link-saver-extension.git
-
Open Google Chrome and go to: chrome://extensions/
-
Enable Developer mode (top-right corner).
4.Click Load unpacked and select the project folder.
- The extension will appear in the Chrome toolbar.
- Understanding Chrome Extension architecture
- Working with Chrome Tabs API
- DOM manipulation using JavaScript
- Using localStorage for persistent data
- Building real-world browser utilities
Madhuri H S