{"id":329869,"date":"2026-07-12T08:42:47","date_gmt":"2026-07-12T08:42:47","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/anysvg-custom-icon-widget-for-elementor\/"},"modified":"2026-07-12T08:42:32","modified_gmt":"2026-07-12T08:42:32","slug":"anysvg-custom-icon-widget-for-elementor","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/anysvg-custom-icon-widget-for-elementor\/","author":23459047,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.1","stable_tag":"1.0.1","tested":"7.0.1","requires":"5.6","requires_php":"7.4","requires_plugins":null,"header_name":"AnySVG - Custom icon widget for elementor","header_author":"arhamashfaq","header_description":"A custom Elementor widget that allows you to paste raw SVG code and style it using all standard Elementor Icon controls.","assets_banners_color":"f8fafe","last_updated":"2026-07-12 08:42:32","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/arhamashfaq.com\/","header_plugin_uri":"","header_author_uri":"https:\/\/arhamashfaq.com","rating":0,"author_block_rating":0,"active_installs":0,"downloads":25,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.1":{"tag":"1.0.1","author":"arhamashfaq","date":"2026-07-12 08:42:32"}},"upgrade_notice":[],"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3604547,"resolution":"128x128","location":"assets","locale":"","width":1254,"height":1254},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3604547,"resolution":"256x256","location":"assets","locale":"","width":1254,"height":1254}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3604856,"resolution":"1544x500","location":"assets","locale":"","width":2172,"height":724},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3604856,"resolution":"772x250","location":"assets","locale":"","width":2172,"height":724}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.1"],"block_files":[],"assets_screenshots":[],"screenshots":{"1":"The AnySVG widget panel controls."}},"plugin_section":[],"plugin_tags":[44701,76538,497,2904,2905],"plugin_category":[50],"plugin_contributors":[261517],"plugin_business_model":[],"class_list":["post-329869","plugin","type-plugin","status-publish","hentry","plugin_tags-custom-icon","plugin_tags-elementor","plugin_tags-icon","plugin_tags-svg","plugin_tags-vector","plugin_category-media","plugin_contributors-arhamashfaq","plugin_committers-arhamashfaq"],"banners":{"banner":"https:\/\/ps.w.org\/anysvg-custom-icon-widget-for-elementor\/assets\/banner-772x250.png?rev=3604856","banner_2x":"https:\/\/ps.w.org\/anysvg-custom-icon-widget-for-elementor\/assets\/banner-1544x500.png?rev=3604856","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/anysvg-custom-icon-widget-for-elementor\/assets\/icon-128x128.png?rev=3604547","icon_2x":"https:\/\/ps.w.org\/anysvg-custom-icon-widget-for-elementor\/assets\/icon-256x256.png?rev=3604547","generated":false},"screenshots":[],"raw_content":"<!--section=description-->\n<p>Tired of being limited to pre-bundled icon libraries in Elementor? AnySVG lets you use <strong>any SVG icon<\/strong> on the web!<\/p>\n\n<p>Simply paste your raw SVG code directly into the widget, and style it with all the familiar controls of Elementor's native Icon widget.<\/p>\n\n<h3>Key Features<\/h3>\n\n<ul>\n<li><strong>Paste Raw SVG<\/strong>: Paste clean SVG code from Heroicons, Bootstrap Icons, FontAwesome, or your own design tools.<\/li>\n<li><strong>Auto-Cleaning and Scale Prep<\/strong>: Automatically strips inline width, height, and style attributes so the Elementor size settings can scale the icon beautifully.<\/li>\n<li><strong>Auto viewBox Synthesis<\/strong>: If your SVG is missing a viewBox but has width and height, AnySVG automatically adds it so it never crops.<\/li>\n<li><strong>Advanced Color Overrides<\/strong>: Select from four color mapping modes: Keep Original (for colored logos), Force Fill, Force Stroke, or Force Both.<\/li>\n<li><strong>Familiar Elementor Controls<\/strong>: Customize View (Default, Stacked, Framed), Shape (Circle, Square), Link URL, Size, Spacing\/Padding, Border Width, Border Radius, Rotation, and Alignments.<\/li>\n<li><strong>Normal &amp; Hover States<\/strong>: Configure primary\/secondary colors and hover transitions.<\/li>\n<li><strong>Backbone Live Preview<\/strong>: Instant updates inside the Elementor editor screen.<\/li>\n<\/ul>\n\n<!--section=installation-->\n<ol>\n<li>Upload the plugin folder <code>anysvg<\/code> to the <code>\/wp-content\/plugins\/<\/code> directory, or upload the ZIP file via the WordPress plugin uploader.<\/li>\n<li>Activate the plugin through the 'Plugins' menu in WordPress.<\/li>\n<li>Open any page in Elementor editor, drag the \"AnySVG Icon\" widget into your layout, and start designing.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"can%20i%20use%20multi-colored%20svgs%3F\"><h3>Can I use multi-colored SVGs?<\/h3><\/dt>\n<dd><p>Yes! Set the <strong>Color Override Mode<\/strong> to <strong>Keep Original Colors<\/strong> to preserve the custom gradients or colors of your logo or graphic.<\/p><\/dd>\n<dt id=\"how%20do%20i%20resize%20the%20svg%3F\"><h3>How do I resize the SVG?<\/h3><\/dt>\n<dd><p>Use the <strong>Size<\/strong> slider under the Style tab. The plugin automatically cleans up hardcoded SVG widths\/heights so Elementor's sizing overrides them correctly.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.1<\/h4>\n\n<ul>\n<li>Bump version to 1.0.1.<\/li>\n<li>Add Requires Plugins header.<\/li>\n<li>Secure and expand SVG sanitizer whitelist (clip-path, masks, symbol support).<\/li>\n<li>Fix XML comments\/prologue bypassing cleanup.<\/li>\n<li>Smooth CSS transitions for hover state colors.<\/li>\n<\/ul>\n\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release of AnySVG custom icon widget.<\/li>\n<\/ul>","raw_excerpt":"A custom Elementor widget that allows you to paste raw SVG code and style it using all standard Elementor Icon controls.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/329869","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=329869"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/arhamashfaq"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=329869"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=329869"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=329869"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=329869"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=329869"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=329869"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}