How to automate svg filter injection across multiple icon files
- Step 1Define your filter preset — Create a filter config object: { type: 'drop-shadow', dx: 2, dy: 2, stdDeviation: 3, flood_color: '#000000', flood_opacity: 0.3 }. This is the filter applied to all SVGs in the batch.
- Step 2Call the batch filter API — POST your filter config and all SVG files to /api/svg/apply-filter. The API returns a ZIP with each SVG updated to include the filter definition and filter attribute on the root element.
- Step 3Validate the visual output — Open a sample of the filtered SVGs in a browser. Check that the effect looks consistent across different icon shapes — some shapes may need adjusted filter parameters.
Frequently asked questions
Can I apply different filters to different icons in one batch?+
Yes. Pass a filter_map in the API request: { 'logo.svg': { type: 'glow' }, 'icon-*.svg': { type: 'drop-shadow' } }. Glob patterns match multiple files to the same filter config.
Does batch filter injection preserve existing filters?+
By default, the API adds the new filter alongside any existing filter. Pass replace_existing: true to remove existing filter definitions before injecting the new one.
Can I apply filters to SVG sprites?+
Yes. Filter injection works on sprite files (with multiple symbol elements). The filter is applied to the wrapper SVG element and affects all symbols when they are used via use elements.
What plan is required for batch filter injection?+
Batch filter injection via API requires the Developer plan. Single-file filter injection is available in the browser UI on Pro.
Privacy first
Every JAD SVG tool runs entirely in your browser using the DOM API and Canvas. Your SVG files never leave your device — verified by zero outbound network requests during processing.