A photo reflection effect simulates a mirror or glossy surface beneath or beside your subject: the image appears to continue into a softer, flipped duplicate that fades away. You see this treatment constantly in product photography on e‑commerce sites, in keynote slides where hardware “sits” on a virtual stage, and in social posts that want a premium, studio-lit feel without a physical acrylic riser. Reflections sell material cues—glass, lacquer, polished metal, wet floors—because viewers unconsciously associate sharp originals with crisp reflections that decay with distance. SynthQuery’s Photo Reflection Tool recreates that look directly in the browser: you upload a raster image, choose whether the mirror sits below, above, or to either side, tune how tall or wide the reflection is relative to the source, pick a linear or exponential opacity falloff, add optional blur so the duplicate reads as secondary, insert a controllable gap between subject and mirror, and optionally paint a solid or vertical gradient surface behind the whole composition. Every decode, transform, and export runs client-side with HTML5 Canvas, which means your pixels stay on your device while you iterate. When your project also involves copy for listings or ads, pair imagery work with SynthQuery’s AI Detector and Humanizer so headlines and disclaimers match the polish of your visuals. For the full catalog of utilities, visit the free-tools hub and the directory at https://synthquery.com/tools.
Why reflections read as “premium” in marketing
Human vision expects coherent lighting: if a product looks lit from above, a faint mirrored echo anchored to the same horizon feels plausible. Reflections also separate the subject from flat white backgrounds, giving designers a middle ground between a raw cutout and a full environmental render. In presentations, a subtle floor reflection grounds screenshots and device mockups so they do not appear to hover. The risk is overuse—when opacity stays too high or the gap disappears entirely, the effect can resemble a cheap flip duplicate. This tool gives you independent levers for peak opacity, distance-based fade, and blur so you can stop before the mirror overwhelms the hero subject.
Glossy tables, glass shelves, and abstract stages
Physical studios achieve reflections with polarizing filters, black acrylic sheets, and carefully flagged lights. When you lack that setup, a digital reflection approximates the cue: softer than the original, usually shorter in height, and often partially desaturated by blur alone. For abstract marketing backdrops rather than literal glass simulation, a left or right reflection can frame typography in widescreen hero images. SynthQuery keeps the math transparent—flip a strip, feather its alpha, optionally soften with a Gaussian-class Canvas filter—so you can iterate quickly before committing assets to Figma or a CMS.
Privacy and workflow fit
Because processing never uploads the bitmap to SynthQuery for this page, you can experiment on embargoed packaging shots or unreleased UI captures on a standard laptop. EXIF metadata is typically stripped on re-encode; retain your camera originals elsewhere when GPS or rights fields matter. Longest edge length is capped at four thousand ninety-six pixels for stability, consistent with sibling imaging tools. After export, you might soften the background further with the Gaussian Blur Tool, rebalance tone with Brightness or Contrast, or add miniature focus with Tilt-Shift—each linked from the related-tools list below.
What this tool does
The interface follows the same proven layout as other SynthQuery image editors: upload first, adjust controls while a PNG preview regenerates, drag the vertical comparison handle to verify the original against the reflected composite, then download in a format your channel accepts. Reflection direction swaps which edge of the canvas anchors the mirror—bottom is the classic product-shot orientation, top suits hanging elements or inverted layouts, and horizontal modes help ultrawide hero art or side-by-side compositions. Reflection height spans ten to one hundred percent of the relevant image axis: for vertical modes that percentage maps to image height; for horizontal modes it maps to image width, so a fifty-percent right reflection occupies half as many pixels wide as your source. The opacity fade curve controls how quickly the duplicate disappears as it moves away from the attachment edge: linear decreases evenly, while exponential falls off faster in the mid zones—useful when you want a strong mirror line that still vanishes before the canvas edge. Peak reflection opacity scales the entire strip before the distance fade, letting you pull an effect from nearly invisible whispers to bold showroom gloss. Gap adds literal breathing room in pixels between the untouched image and the flipped strip, which often sells the illusion of a thin air layer or table thickness. Reflection blur applies a separable Gaussian-style Canvas filter to the mirrored pixels only, so crisp packaging edges stay sharp in the original while the echo softens like a shallow depth-of-field secondary image. Surface modes let you export with a transparent background—ideal for PNG overlays in slide software—or fill behind both the subject and reflection with a solid swatch or a top-to-bottom gradient that reads as studio backdrop or night-sky fade. Loading states cover slow TIFF decodes; validation toasts explain disallowed types or oversize files. Keyboard users can move the comparison divider with arrow keys, Home, and End, matching accessibility patterns from the brightness and blur tools.
Multi-direction mirroring without leaving the tab
Switching direction recomputes layout dimensions instantly: bottom and top modes grow canvas height; left and right modes grow width. The preview scales to your viewport so mobile editors still get a draggable strip without horizontal overflow. Divider alignment compensates so the “before” image lines up with the source region inside the larger result canvas—important when the reflection extends below or above rather than beside.
Fade curves and blur as creative partners
Linear fades feel predictable on geometric products; exponential fades exaggerate the sense that light energy dissipates quickly—handy for busy textures where a long linear tail would show muddy repetition. Blur radii from zero to twenty-five pixels operate in image space after the flip; combine modest blur with exponential fade for Apple-keynote-style pedestals, or keep blur at zero when you need a crisp mirror for abstract graphics.
Surface fills and export hygiene
Transparent exports preserve alpha around subjects when your PNG source already includes a cutout—remember JPEG cannot store transparency, so pick PNG when layering in Keynote, PowerPoint, or Figma. Gradient surfaces use a vertical ramp from color one to color two across the entire output bounds, which keeps both the subject and reflection embedded in the same atmospheric wash. Match-original download follows the same BMP/TIFF-to-PNG fallback pattern as other Canvas utilities when browsers lack legacy encoders.
Technical details
Implementation begins by drawing the decoded bitmap into a working canvas whose dimensions respect the longest-edge cap. A second strip canvas samples the appropriate edge region—bottom, top, left, or right—then applies a two-dimensional transform that flips the strip across the attachment axis so pixels appear mirrored. Optional blur clones that strip through CanvasRenderingContext2D’s filter blur operator, which browsers implement as a Gaussian-class convolution in user space; exact kernel details vary by engine but match designer expectations for softening. Alpha falloff multiplies each pixel’s opacity as a function of distance from the attachment edge: linear mode uses one minus normalized distance; exponential mode raises that complement to a power greater than one so mid-strip values drop faster. The original image and faded reflection composite over an optional background fill—clear for transparency, solid rectangle, or linear gradient—then export uses toBlob with JPEG quality when lossy formats are chosen. This pipeline mirrors how manual designers stack layers in desktop software—flip, mask with gradient, blur, merge—while remaining deterministic and repeatable for a single flattened output.
Compositing order and color management
Background fills draw first, then the source image, then the reflection strip, matching how you would layer in a static editor. Browser Canvas assumes sRGB; wide-gamut masters may shift slightly on export—validate critical brand colors on target hardware.
Performance on large files
Blur and per-pixel fade scale with strip pixel count; extremely tall reflections on four-megapixel sources may take noticeable milliseconds. If previews stutter, reduce reflection height temporarily or preprocess in the Image Resizer.
Use cases
E‑commerce leads use reflections to make pack shots feel grounded on category pages where vendors compete for scroll-stoppers; a restrained twenty-five to forty percent reflection height with a twelve-pixel gap often reads cleaner than a full mirror. Presentation designers drop UI screenshots onto synthetic stages so slides feel dimensional without sourcing stock 3D renders. Web teams extend hero photography downward into reflected gradients that hold headline text without adding another stock photo license. Social media managers export square crops with side reflections to imply motion or duplication for carousel continuity. Portfolio photographers showcase prints or framed work with top reflections to suggest gallery lighting. Content marketers combine reflective comps with SynthQuery’s AI Detector on accompanying blog prose when AI-assisted copy policies apply. Print designers should export at sufficient resolution and soft-proof; Canvas re-encodes eight-bit sRGB, which is typical for web but may need ICC-aware review for packaging print.
Product showcase and marketplace thumbnails
Start with bottom reflection, peak opacity between sixty and eighty percent, linear fade, and one to three pixels blur. Increase gap if the product’s bottom edge is busy—small gaps can merge visually with shoe treads or laptop feet. Export PNG when marketplaces allow transparency; otherwise JPEG with a gradient surface prevents flat white halos around dark goods.
Slides, PDFs, and pitch decks
Use surface gradients that match your template’s footer color stops so the reflection feels integrated rather than pasted. Horizontal reflection can echo a device toward the margin where bullet points live, but keep opacity conservative so text contrast stays WCAG-friendly.
Social and paid creative iteration
Rapid A/B tests benefit from local tools: duplicate tabs with different fade modes, screenshot previews, or batch exports manually. Chain into Contrast or Saturation if the reflected strip needs less chroma noise after blur.
How SynthQuery compares
CSS-only reflections via vendor properties or duplicate elements can look fine for live websites but rarely produce a flattened asset you can email, print, or upload to a marketplace that demands a single file. Desktop suites offer infinite layer stacks and calibrated color, yet they require installs, large project files, and often training before you achieve a simple mirror. SynthQuery targets the middle: more control than a one-line CSS box-reflection (direction, gap, blur, fade curve, surface), immediate PNG or JPEG download, no account wall for the utility itself, and no server round trip for your pixels. Photoshop remains indispensable for multi-layer brand systems; this page excels when you need one polished composite in under a minute on a locked-down machine. The comparison table below summarizes practical trade-offs without naming specific vendors.
Aspect
SynthQuery
Typical alternatives
Deliverable
Single flattened PNG or JPEG you can attach, upload, or drop into slides after tuning every control in-browser.
CSS reflections live only in code; some mobile editors export watermarked or account-gated files.
Control granularity
Independent direction, span percent, gap, blur, peak opacity, linear versus exponential fade, and optional surface fill.
Decode and composite locally in Canvas for this tool’s image path.
Cloud editors may process on remote GPUs—read terms before uploading sensitive packaging.
Depth versus a full DCC pipeline
Focused on believable 2D reflections rather than ray-traced caustics or 3D floor planes.
3D and ray tracing remain necessary when perspective, curvature, or animated lighting matter.
How to use this tool effectively
Walk through these steps whenever you want a downloadable reflected composite without opening a heavyweight editor.
Step 1: Upload your image
Drag a file onto the dashed drop zone or choose Browse. JPG, PNG, WebP, BMP, and TIFF are accepted up to the stated megabyte limit. Wait for the spinner to clear—very large TIFF files may take several seconds to decode.
Step 2: Choose reflection direction
Pick Bottom for classic product-on-table imagery, Top when the mirror should appear above the subject, or Left/Right for widescreen layouts. The preview canvas resizes immediately so you can judge negative space.
Step 3: Set reflection span and gap
Move the reflection height slider between ten and one hundred percent; remember it maps to height for vertical directions and width for horizontal ones. Adjust the gap slider to insert pixels between the original and the flipped strip until the separation feels intentional.
Step 4: Tune fade, blur, and peak opacity
Select Linear or Exponential fade to control how quickly the mirror disappears. Raise or lower peak opacity to set the strongest mirror strength at the attachment edge. Add blur pixels until the reflection reads secondary—zero preserves razor duplication for abstract designs.
Step 5: Optional surface color or gradient
Leave the surface transparent when layering in another app, choose Solid and a color picker value for a stage fill, or Gradient with top and bottom colors for atmospheric backdrops.
Step 6: Preview with the before/after divider
Drag the vertical handle or use keyboard arrows to compare the untouched original against the reflected result. Confirm alignment, gap, and fade on both desktop and mobile widths if responsive crops matter.
Step 7: Download PNG or JPEG
Pick match original, explicit PNG for transparency, or JPEG for smaller attachments, then Download. Archive your unedited master separately for future campaigns.
Limitations and best practices
Reflections cannot invent hidden surfaces: if your source crops tightly against a subject’s shoes, a tall bottom reflection may look like the product is floating on an infinite mirror—shorten the span or add a gradient surface. Highly noisy ISO images can look gritty in mirrored strips even after blur; consider mild noise reduction upstream. JPEG sources recompressed multiple times may show blockiness in soft fades—start from PNG masters when possible. Animated GIFs and RAW files should be converted to eight-bit raster elsewhere first. Mention AI-generated or heavily edited imagery where platform policies require disclosure. This utility does not replace 3D lighting when accurate perspective curvature is mandatory.
Authoritative list of SynthQuery capabilities including emerging imaging utilities.
Frequently asked questions
Believable for thumbnails and slides when you keep peak opacity moderate, add a small gap, and feather with exponential fade plus light blur—viewers accept the cue as stylized gloss rather than physical simulation. It will not reproduce curved glass, Fresnel falloff, or chromatic aberration. For packaging legal reviews where literal material claims matter, photograph the actual surface or use calibrated 3D renders instead of inferring from a mirrored duplicate.
High-resolution PNGs with clean edges and consistent lighting produce the cleanest mirrors. Busy grass or textured floors at the bottom edge can create distracting repetition in the reflection—crop or mask in another tool first, or shorten reflection height. For cutouts on transparent backgrounds, export PNG from this page so the mirror shares the same alpha context as your subject.
Yes when you keep the surface mode transparent and download PNG. JPEG fills undefined areas with opaque color, so transparency collapses. BMP and TIFF masters that match-original may map to PNG because browser encoders are inconsistent with legacy containers—pick explicit PNG when alpha is non-negotiable.
You may, provided resolution and color are verified. Canvas exports eight-bit sRGB; upscale or re-link vector logos elsewhere before high-LPI printing. Soft-proof gradients and fades—very shallow exponential tails can posterize on some presses. Always retain an unreflected master for re-editing.
Often yes: a faint contact shadow grounds the object while the reflection sells the surface. Apply shadow in a dedicated step—SynthQuery’s drop-shadow route when available—or composite manually so shadow sits beneath both subject and mirror. Avoid doubling darkness: if the shadow is heavy, lower reflection peak opacity so the stack does not muddy.
Linear fade subtracts opacity at a constant rate along the strip, which is easy to reason about and matches many stock tutorials. Exponential fade removes energy faster through the midsection, which often looks more natural when the reflection would lose coherence quickly in real gloss. Switch modes while watching the comparison slider to learn your brand’s preference.
Usually that is desirable—buyers should read the upright packaging, not mirrored legal copy. If mirrored text remains too sharp, increase blur or switch to exponential fade. For screenshots where mirrored UI text could confuse accessibility reviewers, shorten reflection height or reduce peak opacity dramatically.
No—the reflection pipeline runs entirely in your browser tab using Canvas. Network activity may still include normal page assets or analytics depending on your configuration, but the bitmap transformation described here does not send your image bytes to SynthQuery servers. Follow corporate policy for offline workflows if you need air-gapped assurance.
Treat the export as the source of truth for static images—embed the PNG in your site instead of trying to duplicate filter stacks exactly in CSS. If you must align live CSS with a static asset, approximate direction and gap first, then adjust opacity and blur by eye; browsers and Canvas filters will not match pixel-for-pixel.
Reduce reflection span, lower blur radius, or shrink the source in the Image Resizer. Close other GPU-heavy tabs. The preview encodes to PNG for comparison fidelity; brief “Rendering reflection” states are normal on large images.