Webhook SVG icon, line

Webhook SVG icon, line

A curved arrow connects two small circles, with a short path returning from the second. It suits a webhook configuration page or an event integration diagram.

Similar SVGs

More from Code and Developer Icons, Line · Set 2

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/CAZXeUZ0mEUs/amnt.svg" alt="Webhook" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="navy" data-name="Navy"><path d="M755 316c-96-70-202-98-319-66-49 13-95 37-134 69-19 16-36 33-51 51-5 5-17 25-22 27-2 1-39-2-48-1-119 14-145 181-35 230 51 23 114 6 146-38 25-35 33-81 15-121-4-11-12-20-17-30 10-17 26-33 41-47 76-69 172-98 273-71 33 9 70 23 96 46-4 4-9 7-12 12-25 36 45 36 61 47-101 100 7 261 133 201 123-60 71-246-69-231-3-17-5-34-8-52-5-37-11-66-50-26zm27 3l14 96-91-26c23-23 32-23 0-45-18-13-37-24-57-32-47-19-101-28-151-22-85 11-175 60-221 132-10-5-18-12-28-16 62-80 143-135 246-147 56-6 115 2 167 25 22 9 43 21 63 34 35 24 24 29 58 1zm34 97c15-4 32-1 46 4 102 33 81 184-24 194-55 5-105-39-108-94-1-26 9-54 27-73 5-4 12-15 19-16 15-2 36 22 40-15zm-625 0c94-7 139 113 70 173-17 15-37 24-59 25-133 7-139-187-11-198z" fill="#0b1e3a" stroke="#0b1e3a"/><path d="M412 629c2-5 7-10 9-16 11-37-36-27-56-25-13 1-40 0-51 6-4 2-8 8-9 13-1 9 26 81 32 89 5 6 13 9 20 7 10-3 14-15 19-22 14 5 26 15 39 21 40 18 83 25 125 23 19-1 39-4 57-10 9-2 19-8 29-10 6 0 11 3 17 4 21 3 43-10 49-32 9-29-13-58-43-57-29 1-26 13-41 24-7 6-20 8-29 11-61 16-113 3-167-26zm-9-24c-5 6-17 19-16 27 1 15 64 39 78 42 47 13 94 9 139-6 2 7 4 15 8 21-49 16-99 22-150 8-21-5-42-14-61-25-34-19-26-21-49 10l-25-71zm244 35c30-3 35 45 5 48s-36-45-5-48z" fill="#0b1e3a" stroke="#0b1e3a"/></g><g id="turquoise" data-name="Turquoise"><path d="M816 416c-4 37-25 13-40 15-7 1-14 12-19 16-18 19-28 47-27 73 3 55 53 99 108 94 105-10 126-161 24-194-14-5-31-8-46-4z" fill="#15c9b6" stroke="#15c9b6"/><path d="M403 605l-76 6 25 71c23-31 15-29 49-10 19 11 40 20 61 25 51 14 101 8 150-8-4-6-6-14-8-21-45 15-92 19-139 6-14-3-77-27-78-42-1-8 11-21 16-27z" fill="#15c9b6" stroke="#15c9b6"/><path d="M647 640c-31 3-25 51 5 48s25-51-5-48z" fill="#15c9b6" stroke="#15c9b6"/></g><g id="blue" data-name="Blue"><path d="M191 416c-128 11-122 205 11 198 22-1 42-10 59-25 69-60 24-180-70-173z" fill="#2986fa" stroke="#2986fa"/><path d="M782 319c-34 28-23 23-58-1-20-13-41-25-63-34-52-23-111-31-167-25-103 12-184 67-246 147 10 4 18 11 28 16 46-72 136-121 221-132 50-6 104 3 151 22 20 8 39 19 57 32 32 22 23 22 0 45l91 26z" fill="#2986fa" stroke="#2986fa"/></g></svg>
CSS background-image
.webhook {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/CAZXeUZ0mEUs/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.webhook {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/CAZXeUZ0mEUs/amnt.svg") center / contain no-repeat;
}
React
import WebhookSvg from "./webhook.jsx"; // from the React tab above

<WebhookSvg width={48} height={48} />

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Webhook: A curved arrow leading from one small circle into another, with a short return path. A flat colour icon. Use smaller endpoint circles, thinner line-style paths, and a distinctly shorter return path to avoid reading as a generic sync icon. as part of the pack Code and Developer Icons, Line · Set 2. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings