{ "generatedAt": "2026-08-29T02:33:28.256Z", "reports": [ { "route": "/preview/demo", "ref": "demo.html", "deltas": [], "counts": { "added": 0, "removed": 0, "tagMismatch": 0, "textMismatch": 0, "nodesAdded": 0, "nodesRemoved": 0 } }, { "route": "/preview/list-tools", "ref": "list-tools.html", "deltas": [ { "path": "body > main:1 > div:2 > div:1 > div:2 > b:1", "type": "added", "tag": "b", "text": "130", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:1 > div:2 > span:2", "type": "textMismatch", "ours": "TOOLSAVAILABLE", "ref": "TOOLS AVAILABLE" }, { "path": "body > main:1 > div:2 > div:1 > div:2 > b:1", "type": "removed", "tag": "b", "text": "32", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > i:2", "type": "added", "tag": "i", "text": "21 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > i:2", "type": "removed", "tag": "i", "text": "05 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Opens a JPEG and saves it as lossless PNG. Transparency, if present, is preserved.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Re-encode JPEG files as lossless PNG while preserving transparency.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Re-encodes a WebP image into universal PNG.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Turn WebP images into a universal PNG format for any workflow.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Convert GIF to PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Extracts the first frame of a GIF animation and saves it as PNG.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "PNG to Base64", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Encode an image as a base64 string for embedding in code or styles.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Convert BMP to PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > span:2", "type": "added", "tag": "span", "text": "Re-encodes BMP into compact lossless PNG.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "PNG to Data URI", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Build a complete data URI ready for HTML and CSS.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Convert ICO to PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > span:2", "type": "added", "tag": "span", "text": "Turns an .ico icon into a regular PNG of the chosen size.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Convert PNG to JPG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Composite transparency over a selected backdrop and export JPEG.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:6", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:7", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:8", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:9", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:10", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:11", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:12", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:13", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:14", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:15", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:16", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:17", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:18", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:19", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:20", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:21", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > i:2", "type": "added", "tag": "i", "text": "21 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > i:2", "type": "removed", "tag": "i", "text": "05 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Circle Mask PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Cuts the image into a circle. Diameter is set as a share of the smaller side.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Remove background PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Remove a solid background by color, tolerance, or edge-connected regions.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Square Mask PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Cuts the image into a rectangle with sides as a share of the smaller side.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Extract alpha mask", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Turn the alpha channel into a clean black-and-white mask.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Star Mask PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Cuts the image into an n-pointed star with adjustable inner radius and rotation.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Round corners PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Clip the image corners by a precise radius percentage.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Wavy Mask PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > span:2", "type": "added", "tag": "span", "text": "Cuts the image into a wavy-edged circle: radius is modulated by a sine with chosen amplitude and frequency.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Outline PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Add a colored ring around opaque content with adjustable thickness.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Remove alpha channel PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > span:2", "type": "added", "tag": "span", "text": "Composites the image over a white background and saves without transparency.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Change PNG opacity", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Multiply the alpha channel while keeping the original colors unchanged.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:6", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:7", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:8", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:9", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:10", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:11", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:12", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:13", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:14", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:15", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:16", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:17", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:18", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:19", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:20", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:21", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:1 > i:2", "type": "added", "tag": "i", "text": "25 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:1 > i:2", "type": "removed", "tag": "i", "text": "05 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Split PNG into HSL", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Decomposes the image into Hue, Saturation and Lightness components.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Create gradient PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Generate a smooth transition between two colors with direction controls.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Split PNG into HSV", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Decomposes the image into Hue, Saturation and Value (brightness) components.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Grayscale PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Convert the image to luminance-based shades of gray.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Split PNG into HSI", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Decomposes the image into Hue, Saturation and Intensity components.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Invert colors PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Invert every color channel while leaving alpha untouched.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Convert PNG to CMYK Colors", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > span:2", "type": "added", "tag": "span", "text": "Decomposes the image into print-style Cyan, Magenta, Yellow and Key (black) components.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Brightness & contrast", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Adjust brightness and contrast across a controlled range.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Convert PNG to YCbCr Colors", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > span:2", "type": "added", "tag": "span", "text": "Decomposes the image into Luma (Y) and Blue-difference / Red-difference chroma components.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Temperature PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Make an image warmer or cooler with a single precise control.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:6", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:7", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:8", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:9", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:10", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:11", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:12", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:13", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:14", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:15", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:16", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:17", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:18", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:19", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:20", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:21", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:22", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:23", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:24", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:25", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:1 > i:2", "type": "added", "tag": "i", "text": "18 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:1 > i:2", "type": "removed", "tag": "i", "text": "05 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Scales the image with bilinear interpolation. With aspect kept, one side defines the scale; if both are set, the image fits inside them.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Scale an image with bilinear interpolation and optional aspect lock.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Cuts out a rectangular area. Coordinates and sizes may go beyond the image — the area is clipped to the intersection.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Cut a rectangular area with exact coordinates and dimensions.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Rotates by 90°, 180° or 270° clockwise without quality loss.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Rotate by 90, 180, or 270 degrees without quality loss.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2 > span:2", "type": "added", "tag": "span", "text": "Mirrors horizontally or vertically without quality loss.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Mirror the image horizontally or vertically.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2 > span:2", "type": "added", "tag": "span", "text": "Expands the canvas on all sides by the chosen number of pixels.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Expand the canvas on all sides by a chosen number of pixels.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:6", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:7", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:8", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:9", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:10", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:11", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:12", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:13", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:14", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:15", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:16", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:17", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:18", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:1 > i:2", "type": "added", "tag": "i", "text": "8 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:1 > i:2", "type": "removed", "tag": "i", "text": "04 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Gaussian blur: three passes of separable box blur — fast at any radius. Transparent edges do not darken.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Apply a fast Gaussian-style blur with transparent edge handling.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Emphasizes edges with a sharpening kernel; strength sets the blend with the original. 0% means no change.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Emphasize edges with an adjustable sharpening kernel.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Smoothly darkens the edges of the image, leaving the center untouched.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Smoothly darken the image edges while preserving the center.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Pixelate PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > span:2", "type": "added", "tag": "span", "text": "Averages every blockSize×blockSize area into one color — classic mosaic.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "JPEG artifacts", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Simulate low-quality JPEG recompression for testing.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:5", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:6", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:7", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:8", "type": "added", "tag": "a", "text": "", "nodes": 9 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > span:1", "type": "added", "tag": "span", "text": "TEXT", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > i:2", "type": "added", "tag": "i", "text": "3 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > span:1", "type": "removed", "tag": "span", "text": "ANALYZE", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > i:2", "type": "removed", "tag": "i", "text": "04 TOOLS", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Add text to PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > span:2", "type": "added", "tag": "span", "text": "Draws a text label on the image: font, size, color, bold, position on a 3×3 grid and an optional backing plate.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "PNG info", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Inspect dimensions, alpha presence, and unique color count.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Date stamp PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > span:2", "type": "added", "tag": "span", "text": "Stamps the current date and time using a format string (YYYY MM DD hh mm ss tokens). Same styling options as Add text.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Check grayscale", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Report whether the image contains only shades of gray.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > strong:1", "type": "added", "tag": "strong", "text": "Watermark Tile PNG", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > span:2", "type": "added", "tag": "span", "text": "Covers the image with a repeating diagonal semi-transparent text tile — a protection watermark.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > strong:1", "type": "removed", "tag": "strong", "text": "Check transparency", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > span:2", "type": "removed", "tag": "span", "text": "Detect transparent and semi-transparent pixels.", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:4", "type": "added", "tag": "span", "text": "", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > svg:4", "type": "removed", "tag": "svg", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4", "type": "removed", "tag": "a", "text": "", "nodes": 8 }, { "path": "body > main:1 > div:2 > div:3 > section:7", "type": "added", "tag": "section", "text": "", "nodes": 122 }, { "path": "body > main:1 > div:2 > div:3 > section:8", "type": "added", "tag": "section", "text": "", "nodes": 194 } ], "counts": { "added": 150, "removed": 80, "tagMismatch": 0, "textMismatch": 1, "nodesAdded": 1043, "nodesRemoved": 87 } }, { "route": "/preview/tools/linear-gradient-png", "ref": "gradient.html", "deltas": [ { "path": "body > main:1 > div:2 > section:1", "type": "tagMismatch", "ours": "section", "ref": "div" }, { "path": "body > main:1 > div:2 > section:1", "type": "textMismatch", "ours": "", "ref": "PNG PROCESSING SINGLE TOOL" }, { "path": "body > main:1 > div:2 > section:1 > section:1", "type": "added", "tag": "section", "text": "", "nodes": 145 }, { "path": "body > main:1 > div:2 > section:1 > span:1", "type": "removed", "tag": "span", "text": "/", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2", "type": "tagMismatch", "ours": "section", "ref": "div" }, { "path": "body > main:1 > div:2 > section:2 > header:1", "type": "added", "tag": "header", "text": "", "nodes": 5 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > div:1", "type": "added", "tag": "div", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > div:2", "type": "added", "tag": "div", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > h1:1", "type": "removed", "tag": "h1", "text": "Gradient background.", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > p:2", "type": "removed", "tag": "p", "text": "Create a clean, export-ready gradient with precise control over color, direction and transparency.", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > span:2", "type": "removed", "tag": "span", "text": "LIVE PREVIEW", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3", "type": "removed", "tag": "div", "text": "", "nodes": 66 }, { "path": "body > main:1 > footer:3 > span:2", "type": "added", "tag": "span", "text": "pipeline is local-only", "nodes": 2 }, { "path": "body > main:1 > footer:3 > span:2", "type": "removed", "tag": "span", "text": "gradient tool · local-only", "nodes": 1 } ], "counts": { "added": 5, "removed": 6, "tagMismatch": 2, "textMismatch": 1, "nodesAdded": 154, "nodesRemoved": 72 } }, { "route": "/preview/tools/remove-background-png", "ref": "background-remover.html", "deltas": [ { "path": "body > main:1 > div:2 > section:1", "type": "tagMismatch", "ours": "section", "ref": "div" }, { "path": "body > main:1 > div:2 > section:1", "type": "textMismatch", "ours": "", "ref": "PNG PROCESSING SINGLE TOOL" }, { "path": "body > main:1 > div:2 > section:1 > section:1", "type": "added", "tag": "section", "text": "", "nodes": 138 }, { "path": "body > main:1 > div:2 > section:1 > span:1", "type": "removed", "tag": "span", "text": "/", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2", "type": "tagMismatch", "ours": "section", "ref": "div" }, { "path": "body > main:1 > div:2 > section:2 > header:1", "type": "added", "tag": "header", "text": "", "nodes": 5 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > div:1", "type": "added", "tag": "div", "text": "", "nodes": 4 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > div:2", "type": "added", "tag": "div", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > div:3", "type": "added", "tag": "div", "text": "", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > h1:1", "type": "removed", "tag": "h1", "text": "Remove background.", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > div:2 > p:2", "type": "removed", "tag": "p", "text": "Select a background color and tune the edge detection. Changes are processed automatically in your browser.", "nodes": 1 }, { "path": "body > main:1 > div:2 > section:2 > span:2", "type": "removed", "tag": "span", "text": "LIVE PREVIEW", "nodes": 2 }, { "path": "body > main:1 > div:2 > div:3", "type": "removed", "tag": "div", "text": "", "nodes": 71 }, { "path": "body > main:1 > footer:3 > span:2", "type": "added", "tag": "span", "text": "pipeline is local-only", "nodes": 2 }, { "path": "body > main:1 > footer:3 > span:2", "type": "removed", "tag": "span", "text": "background remover · local-only", "nodes": 1 }, { "path": "body > div:2", "type": "added", "tag": "div", "text": "", "nodes": 1 } ], "counts": { "added": 7, "removed": 6, "tagMismatch": 2, "textMismatch": 1, "nodesAdded": 152, "nodesRemoved": 77 } } ] }