Image Replace & Overlay - Quick Image

Rapidly overlay or replace images on any webpage

Quick Image lets you replace or overlay any image on any website in seconds - no code, no DevTools. Who is it for? • Web designers previewing hero images, banners, and product photos in real layouts • Marketing teams doing A/B image testing and comparing creative variations • Anyone who wants to see how a different image would look on a live website Basic workflow: 1. Add images from folder, clipboard, or right click context menu. Batch adding works. 2. Pick a target from auto-detected images, or shift+T. 3. Navigate with arrows to see how images look. 4. Star the best ones with Shift+Enter 5. Compare starred images with number keys 1-9 (or arrow keys) 6. A/B test to original with Space 7. Right click to see original image name / context / url Key features: • Replace any image on a page — works with img elements, srcsets, background images, hero sections, and CSS backgrounds • Overlay mode — drag a floating image anywhere on the page, resize, rotate, and adjust opacity • One-click capture — right-click any image on any site to add it to your collection • Drag & drop or paste images — drop files or paste from clipboard instantly. Batch add folder of images. • Image controls — opacity slider, object-fit, position, scale, flip, and blend modes • Keyboard-driven workflow — arrow keys to cycle images, Space for A/B toggle, number keys for quick select • Global image library — your images are available across all websites • Replace Target Grid — see all page images at a glance, click to replace any of them • Works on any website — WordPress, Shopify, Webflow, Squarespace, custom sites, localhost Images persists in your library through browser restarts and cookie clears, 100% local. How it works: Click the Quick Image icon or press Ctrl+Shift+Q to open the panel Drop, paste, or capture images into your collection Click a page image to select it as the replace target Click a collection image to replace it — instantly, no refresh needed Press Space to toggle between original and replacement (A/B comparison) Quick Image is designed for speed. Minimal clicks, keyboard shortcuts for everything, and instant visual feedback. Your image collection persists across sessions — build it once, use it on every site. Perfect for: website mockups, design reviews, image placeholder replacement, visual regression testing, client presentations, e-commerce product photo testing, and creative asset comparisons. 🔑 License required — get yours at in https://www.rapiddesigntools.com/ Changelog ## 1.3.1 - Extended free version: QuickImage can now be tested with up to 3 images before adding a license. - Customize visible target grid rows and cols - Panel visibility is more reliable - Fixed batch import bugs ## 1.3.0 - Faster background-image swapping - Easier background-pattern targeting - Background-image controls are more reliable - Image Controls slider improvements - Floating panel minimize now docks the panel to the bottom-left corner, and expanding it keeps the panel inside the visible browser window. - Figma plugin imports improvements - Bug fixes ## 1.2.0 - SVG replacement - Settings — Detection: configurable hover and Replace-Grid threshold (default 20px — catches small logo SVGs ). Raise it if too many tiny icons clutter the grid. - Settings — Defaults: per-mode object-fit defaults for Replace Image (cover) and Replace Section (match). Per-image overrides still win. - Apply to N selected: button moved below the X/Y/Scale/Fit controls so it propagates the full set (opacity, blend, flip, position, scale, fit) - Bug fixes ## 1.1.0 Replace Section: pick a whole section (hero, testimonials, etc.) and walk its DOM hierarchy with Alt+↑/↓ — perfect for testing Figma designs in-place on the live site. Match-aspect mode: section replacements resize the target to the image's native aspect ratio, so proportions are exact and page reflows around it, no stretching, no letterbox bleed-through. Good for Figma and other designs in section replace mode. Figma plugin import: install the "Quick Image Chrome Extension Companion App" plugin in Figma, select N frames, run it — frames arrive in your library as separate PNGs. No downloads, no flattening. Faster cycle shortcuts (Ctrl+Shift+,/.): now closer to arrow-key speed when cycling images. Snappier flash + scroll-tracking: highlight overlays follow the page when you scroll or layout shifts, instead of drifting behind. Smarter hover heuristic, refined header chrome, rewritten Cheatsheet, and a long list of small fixes. Fixed freeze animations bugs 1.0.1 Smarter image picking: reliably finds images behind overlays, gradients, and text. Shows element info tooltip while hovering. Video replacement: select and replace video elements with images. Videos pause automatically. Faster image switching: near-instant when cycling through images with arrow keys. Images are preloaded in the background. Fixed gray thumbnails in the visible images grid after scrolling. 1.0.0 Initial release.