<feMerge> - SVG

<feMerge> - SVG | MDN

Usage context

Categories	Filter primitive element
Permitted content	Any number of the following elements, in any order: `<feMergeNode>`

Attributes

Filter primitive attributes: x, y, width, height, result

DOM Interface

This element implements the SVGFEMergeElement interface.

Example

SVG

html

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <filter id="feOffset" x="-40" y="-20" width="100" height="200">
    <feOffset in="SourceGraphic" dx="60" dy="60" />
    <feGaussianBlur stdDeviation="5" result="blur2" />
    <feMerge>
      <feMergeNode in="blur2" />
      <feMergeNode in="SourceGraphic" />
    </feMerge>
  </filter>

  <rect
    x="40"
    y="40"
    width="100"
    height="100"
    stroke="black"
    fill="green"
    filter="url(#feOffset)" />
</svg>

Result

Specifications

Specification
Filter Effects Module Level 1 # feMergeElement

Browser compatibility

Help improve MDN

Learn how to contribute

This page was last modified on Oct 27, 2025 by MDN contributors.