CodeSavvy

Developer toolbox with advanced web manipulation tools. Unlock elements, modify text, change fonts, and more.

CodeSavvy is your all-in-one AI writing companion, web developer toolbox, and real-time DOM debugging extension. Designed for developers, writers, designers, QA engineers, and productivity enthusiasts, CodeSavvy lets you refine text with Google Gemini AI, inspect and manipulate live web layouts, extract media assets, generate offline QR codes, and fix mistyped keyboard layouts in seconds. WHAT'S NEW: 🎓 Interactive Welcome Hub & Visual Pin Guide • Instant Onboarding: Automatically guides new users in under 60 seconds. • Visual Toolbar Pin Tutorial: Step-by-step visual walkthrough with screenshot guidance showing how to pin CodeSavvy for 1-click access. • Hosted Test Sandbox: Direct link to our live hosted sandbox environment (codesavvy-docs) where you can test all features on real webpages. 🛡️ Safe Multi-Element & Whole-Page Guard (Ctrl+Shift+L) • Layout Collapse Prevention: Proofread large selections or entire pages safely without breaking HTML structure or webpage styling. • Automatic Clipboard Backup: Enhanced text is automatically copied to your clipboard. • Shadow DOM Floating Preview: Isolated floating comparison card with amber warning banner and two-step confirmation. 🔒 Protected Terms Dictionary & Custom Instructions • Freeze Key Names: Ensure brand names, internal project codenames, API identifiers, or version numbers are NEVER altered by the AI. • Personal Guidelines: Set persistent custom rules (British vs. American English, conciseness, bullet styles) applied to all AI enhancements. • Customizable Favorite Prompt: Assign your favorite prompt to the global shortcut Ctrl+Shift+L (indicated with a star: Improve Text ★). ━━━━━━━━━━━━━━━━━━━━━━━━━━ 🛠️ CORE FEATURES 🤖 AI-Powered Writing Assistant & Context Menu (Google Gemini) Select any text on any webpage to trigger intelligent, context-aware AI text enhancements: • Latest Gemini Models: Gemini 3.5 Flash Lite (ultra-fast & free tier), Gemini 3.6 Flash, and Gemini 3.1 Pro Preview. • 7 Built-in Modes: Improve Text, Advanced Edit, Professional Rephrase, Prompt Engineer, Make Casual, Add Humor, and Roast Mode. • Custom AI Presets: Create, edit inline, and reorder custom prompts with drag-and-drop handles. • Global Shortcut: Refine selected text anywhere on the web in a single keystroke (Ctrl+Shift+L). 🧠 AI Page Studio (Page Summarizer & Q&A) • TL;DR Page Summary: Generate instant executive summaries, key highlights, and reading times with ads and clutter stripped away. • Key Takeaways & Action Points: Extract actionable insights, key statistics, and takeaways in clean markdown bullet points. • Tech Stack Breakdown: Detect libraries, frameworks, APIs, and architectures used in technical articles and repositories. • Explain Simple (ELI5): Translate complex technical jargon or dense documentation into beginner-friendly explanations. • Ask Page (Custom AI Q&A): Ask custom questions directly about the page content with grounded AI responses. 🛠️ Webpage Manipulation & DOM Debugger • Unlock Elements: Instantly remove disabled, readonly, and aria-disabled attributes. Bypasses pointer-events: none and user-select: none, strips disabled classes, and enables editing inline. • Element Zapper with Translucent Glasses HUD: Hover and vaporize sticky banners, overlays, and modal paywalls with an ultra-translucent glassmorphic HUD that you can see through, allowing you to zap elements located directly underneath it, with live Ctrl+Z / On-screen Undo, and root-container safety guards. • Non-Destructive CSS & Box Model Inspector: Hover over any element to view computed dimensions, font stacks, colors, margin, and padding in a floating glassmorphic HUD without touching page styles. Click to copy full CSS declaration snippets. • Smart Dark Mode: Force high-contrast dark theme on light-only websites with active status glow. • Remove Input Limits: Clear maxlength character restrictions on any text field. • Reveal Passwords: Safely convert password inputs into plain readable text. • Toggle Edit Mode: Turn designMode on to edit any text directly on the page (Ctrl+Shift+Y). • Change Font: Apply Google Fonts or system typography organized by clean categories with visual previews. • Force Right-Click & Selection Bypass: Re-enable blocked context menus, text selection, and copy-paste operations. 🎨 Color Studio & Native 0ms Eyedropper • Multi-Format Conversions: Real-time calculation and 1-click copying for HEX, RGB, HSL, and CSS Variables (--color: #...). • Instant Eyedropper: Instant 0ms pixel color sampler from anywhere on your screen. • Palette Swatches: 10 designer preset swatches for rapid prototyping. ⚡ Developer & Media Power Tools • Offline QR Code Generator: Generate instant offline QR codes for the active URL with 1-click link copying and PNG download. • Media & Asset Extractor: Deep-scan the tab for images, SVGs, and background assets with preview gallery and batch download. • Site Storage Wiper: 1-click clean wipe of LocalStorage, SessionStorage, and cookies strictly for the active domain. • Clear Cache & Reload: Empty browser cache and hard-refresh target tab (Ctrl+Shift+R). • Screenshot Utility: Capture the visible area of the active tab and save as PNG. 🔤 Instant Text Utilities • Casing Transforms: Title Case, UPPERCASE, lowercase, Capitalized Case, Sentence case, Slugify, and Alternating case. • Dual-Language Keyboard Mistype Fix: Instantly convert text typed in the wrong keyboard layout between Arabic and English. • Text Highlighter: Highlight selections on the page with customizable colors. 📋 Transformation History & Data Portability • History Import & Export: Export history to .json or import/merge backup files with automatic deduplication. • Unified Settings Backup: Single-file backup and restore of settings, presets, and history. • Before/After Comparison: Side-by-side code blocks with 1-click clipboard copy. • Incognito Mode & Auto-Retention: Pause logging temporarily or configure auto-delete retention schedules. 🌐 Global Multi-Language & RTL Support • 22 Native Languages: Arabic, English, Spanish, French, German, Japanese, Korean, Simplified & Traditional Chinese, Hindi, Turkish, Russian, Vietnamese, Portuguese (Brazil), Indonesian, Italian, Polish, Dutch, Swedish, Thai, Ukrainian, and Persian (Farsi). • Full Bi-Directional RTL Engine: Flawless layout mirroring and typography adjustments for Right-to-Left languages. • Zero-Flicker Preloading: Instant language and theme application from local cache. 🔒 PRIVACY & SAFETY FIRST • Direct API Calls: Your Google Gemini API key is stored safely on your browser profile via chrome.storage.local and sent directly to Google endpoints. No intermediate servers, no proxy tracking. • History Privacy: Complete control over transformation history—choose Always Save, Incognito, or Disabled. • 100% Local Code: No remote code execution; compliant with Manifest V3 security. • Zero Tracking: We do not track, capture, or sell your private data. Elevate your browsing, writing, and web development workflow. Install CodeSavvy today!