Digages

Timileyin Olabajo

SVG Editor adds native support for uploading and editing SVG (Scalable Vector Graphics) directly within your WordPress Media Library. Easily change the colors of your favorite icons, images, and vector assets without needing any external design software.
Whether you’re a web designer, developer, or content creator, SVG Editor is here to simplify your workflow and save you time.
Features:
<ul>
<li>Enable SVG Uploads: Allows you to safely upload SVG files to your WordPress site.</li>
<li>View SVGs in Media Library: Preview your SVG files directly within the WordPress Media Library.</li>
<li>Native WordPress Integration: Works seamlessly within the WordPress Media Library.</li>
<li>Simple Color Editing: Change SVG colors with our intuitive interface.</li>
<li>Sanitized SVGs: Automatically cleans SVG code to prevent security risks and ensure safe usage.</li>
<li>Preserves SVG Integrity: Maintains the scalability and quality of your vector graphics.</li>
<li>Mobile Responsive: Easily edit SVG on the go.</li>
</ul>
About Digages:
SVG Editor is a free and open-source plugin developed and maintained by <a href="https://digages.com/" rel="nofollow ugc">Digages</a>. We’re committed to creating tools that make WordPress more powerful and easier to use.
<a href="https://digages.com/donate/" rel="nofollow ugc">Donate Now</a> | <a href="https://digages.com/" rel="nofollow ugc">Visit Website</a>
Other Plugins by Digages:
<ul>
<li>
<a href="https://wordpress.org/plugins/direct-payments-for-woocommerce/" rel="ugc">Direct Payment for Woocommerce</a>: Direct Payments for WooCommerce makes it easy for WooCommerce store owners to accept payments directly through local and global methods with 0.0% transaction fees. Enable direct payments from your customers via bank transfers, mobile money, crypto and peer-to-peer platforms like Zelle, Venmo, Cash App e.t.c
</li>
<li>
<a href="https://wordpress.org/plugins/direct-payments-wp/" rel="ugc">Direct Payment WP</a>: Direct Payments WP is the ultimate plugin for WordPress users who want a simple and flexible way to accept payments. Whether you’re a freelancer, a small business owner, or running a membership site, Direct Payments WP empowers you to accept payments directly using customizable forms, invoices and pages.
</li>
</ul>
<h3>External API Notice</h3>
This plugin optionally connects to an external API to fetch additional plugin listings. The core functionality of the plugin is fully independent and remains unaffected if the API is not used.
We value user privacy and ensure that no personal or sensitive data is sent to the external API.

SVG Editor: Upload & Change Colors

SVG Editor lets you upload SVG files and change their colors directly within the WordPress Media Library.

Erik

This plugin provides a Svg Block to your block editor, this can be used with any svg icon or image (or even a html snippet). Some key features are provided like automatic markup sanitation, optimization (svgo), and small utility to change the color and the markup that will be very useful for you to create variations of your image.
This block has the same controls as the images, but actually the content is xml markup, and you can change it as you like! This allows thousands of possibilities… You will be able to use css animations or js scripts to animate it, change the inner text of the svg, create variations of the same svg. 
However, this has the disadvantage that the svg will not be copied into the media library, so if you plan to use the same svg several times (buttons, icons, etc.) you are better off creating a reusable block
From a performance point of view, be aware that the image will not be included as an external resource, but will instead be within the markup of the page, thus making svg even faster than it already is.
<h3>Svg are awesome because:</h3>
<ul>
<li>✌️ Are always super sharp!</li>
<li>🪶 Incredibly lightweight and doesn’t require any additional resize image (you only need one source for all screen sizes and resolutions)</li>
<li>⚡ Increased page performance! Using inline SVGs saves can save dozens of requests and save server download bandwith.</li>
<li>🎉 highly customisable and animatable! Embedded svgs are easy to be animated, just use css!</li>
</ul>
<h4>Security</h4>
Since this plugin doesn’t enable uploads of svg images into media library could be considered safer than all the others that enable the upload. 
As if that wasn’t enough Svg’s will be cleaned with DOM purify which indeed is a first class js purifier, those used in php try to mimic how it works.
Svg will be included within the pages as xml fragments, so they will not be processed by imagemagick and cannot be uploaded by anyone from website “side”. Only those with permissions to use the editor will be allowed to ‘upload’ (or rather include) them.
<h4>Inspirations, links</h4>
<a href="https://www.slideshare.net/x00mario/the-image-that-called-me" rel="nofollow ugc">Mario Heiderich the-image-that-called-me</a>
<a href="https://www.fortinet.com/blog/threat-research/scalable-vector-graphics-attack-surface-anatomy" rel="nofollow ugc">Fortinet – Anatomy of Scalable Vector Graphics (Svg) Attack Surface on the Web</a>
<h3>Resources</h3>
<ul>
<li>dompurify © 2015 Mario Heiderich, <a href="https://raw.githubusercontent.com/cure53/DOMPurify/main/LICENSE" rel="nofollow ugc">Apache License Version 2.0</a></li>
<li>svgo © 2021 Kir Belevich, <a href="https://raw.githubusercontent.com/svg/svgo/main/LICENSE" rel="nofollow ugc">MIT License</a></li>
</ul>
<h4>Contribute</h4>
We love your input! We want to make contributing to this project as easy and transparent as possible, whether it’s:
<ul>
<li>Reporting a bug</li>
<li>Discussing the current state, features, improvements</li>
<li>Submitting a fix 💯 or a new feature 🎉</li>
</ul>
We use GitHub to host code, to track issues and feature requests, as well as accept pull requests. 
By contributing, you agree that your contributions will be licensed under its GPLv3 License.

OH MY Svg

Add any svg to your website with the superpowers of the block editor. Out-of-the-box security and speed optimization!

SVG Editor: Upload & Change Colors vs OH MY Svg