Actively Maintained
Redactly
React TypeScript Tailwind CSS Vite Web Extensions API Zod
Overview
I kept pasting things into AI chatbots without thinking too hard about it, API keys, emails, internal names. So I built a browser extension that automatically redacts sensitive patterns before they ever leave your machine, and restores the originals when you copy the AI's response back. You define your own rules with exact matching or regex, control which AI services it runs on, and can export/import configs to share with teammates.
What I built
- Priority-based redaction engine, exact matches before regex, processed in order
- Auto-restoration when copying AI responses back
- Supports ChatGPT, Claude, Gemini, and DeepSeek
- Per-site enable/disable toggles for granular control
- Import/export rule sets for sharing configs across machines
- Real-time rule tester to preview redactions before saving
- Chrome (Manifest V3) and Firefox (Manifest V2) support
What I learned
- Browser extension architecture and the key differences between MV2 and MV3
- Content script injection, message passing, and background service workers
- Building a regex processing pipeline with caching for performance
- Handling different DOM structures across AI service websites without breaking
Architecture
flowchart LR
User([" User"])
subgraph Browser["Browser"]
Input["AI Chat Input"]
subgraph Ext["Redactly Extension"]
CS["Content Script"]
Engine["Redaction Engine
(exact + regex rules)"]
BG["Background
Service Worker"]
Storage["Rule Storage"]
Popup["Popup UI"]
end
Output["AI Response
(redacted)"]
Restored["Copied Text
(originals restored)"]
end
AI[" AI Service
(ChatGPT / Claude / Gemini)"]
User -->|"types"| Input
Input --> CS
CS --> Engine
Engine -->|"reads rules"| Storage
Engine -->|"redacted text"| Output
Output -->|"sent to"| AI
AI -->|"response"| Output
Output -->|"user copies"| Engine
Engine -->|"restores originals"| Restored
Popup -->|"manage rules"| BG
BG --> Storage