v149 · Security · demo

Filter Security Demo

SVG filters on cross-origin restricted iframes and plugins were a visual side-channel attack vector. Chrome 149 closes this by disabling those filters. Explore how the attack worked and what changed.

This is an educational security demo. The "attack" shown below is a simulation using animation — no actual pixel extraction occurs. Chrome 149 prevents the real attack vector.

Before vs After

Before Chrome 149 — Vulnerable

SVG feBlend / feColorMatrix filters could be applied to cross-origin iframes. An attacker could measure per-pixel render timing differences caused by the filter computation — leaking private content from the embedded page.

The timing of "how long the GPU took to process this filter" correlated with pixel brightness, reconstructing image data byte by byte.

/* Attacker CSS applied to cross-origin iframe */ iframe[src="https://bank.example.com/balance"] { filter: brightness(1.0) contrast(1.0); } /* + timing side-channel attack on render → pixel data extracted cross-origin */
Chrome 149+ — Protected

Chrome 149 disables SVG filter effects on iframes that have sandbox without allow-same-origin, or cross-origin iframes without explicit CORS permissions. The filter property is silently ignored.

Same-origin iframes and CORS-enabled cross-origin resources are unaffected — only restricted/untrusted contexts lose filter support.

/* Chrome 149: filter ignored on restricted iframes */ iframe[sandbox][src="cross-origin"] { filter: brightness(1.0); /* → no-op */ } /* Same-origin iframes: filters still work normally */

Attack Animation

A simulation of how SVG filter timing side-channels could reconstruct pixel data from a cross-origin frame, one pixel at a time.

Simulated pixel extraction grid (16×8 = 128 pixels)
Press "Run Attack Simulation" to begin…

Filter context checklist

Which contexts allow or block SVG filters in Chrome 149+:

✓
Same-origin <iframe> Full filter support — same security origin, no side-channel risk.
✓
Cross-origin iframe with allow-same-origin sandbox flag Explicit opt-in to same-origin treatment — filters permitted.
✓
Regular elements (<div>, <img>, same-origin content) Filters unchanged — only cross-origin restricted contexts are affected.
✗
Cross-origin <iframe sandbox> without allow-same-origin Blocked in Chrome 149 — filter timing side-channel risk.
✗
Cross-origin restricted iframes (no CORS headers from embedded origin) Blocked in Chrome 149 — opaque frame content must not be filterable.
✗
Plugins (<embed>, <object>) rendering cross-origin content Blocked — same class of side-channel attack applies.

Compliant usage

/* SAFE: apply filters to same-origin iframe wrapper */ .frame-wrapper { filter: grayscale(100%); /* wrapping div, not the iframe itself */ } /* SAFE: cross-origin iframe you control — add CORS headers */ /* On the embedded origin: Cross-Origin-Resource-Policy: cross-origin */ /* AVOID: applying filter directly to restricted cross-origin iframes */ iframe[sandbox] { filter: blur(2px); } /* ← ignored in Chrome 149 */

see also