Colours and style

Every picture in the library follows these, and so does every download.

Colour of single-colour icons
Palette for colourful pictures
As drawn
100%
Extension SVG icon, line

Extension SVG icon, line

The puzzle piece has a rounded tab and an open notch to suggest an add-on. It works in a plugin directory or an extension settings menu.

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/hrAoVZVPcI7I/amnt.svg" alt="Extension" 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="turquoise" data-name="Turquoise"><path d="M538 134c-3 2-3 3-4 6-1 2 11 30 12 36 4 18 4 35 1 52-5 29-20 55-40 76-44 44-114 55-169 24-54-30-81-96-66-156 1-5 12-29 12-32-1-2-2-4-4-5-5-2-52 0-61 0-38 0-77 0-114 0-6 0-18-2-22 2-5 4-2 78-2 90 0 38 0 76 0 115 0 76 0 152 0 229 0 51 0 102 0 154 0 24-1 50 0 75 0 4-1 10 3 12 5 4 86 1 99 1 37 0 76 0 114 0 76 0 153 0 230 0 38 0 76 0 115 0 10 0 90 1 92-1 4-3 2-14 2-18 0-47 0-94 0-140 0-19-3-40 0-58 1-8 6-16 12-21 26-24 56 9 85 12 31 3 62-8 84-30 44-42 44-119-6-157-29-23-69-26-103-11-9 3-18 11-28 13-15 2-31-4-38-18-3-5-4-10-5-16-2-22 1-44 1-66 0-47-2-95 0-141 0-7 4-19 0-24s-75-3-86-3c-15 0-109-3-114 0z" fill="#0abbac" stroke="#0abbac"/></g><g id="grape" data-name="Grape"><path d="M769 372c0-36-2-71 0-106 1-26 5-119-1-138-4-11-13-20-24-23-19-6-44-2-63-2-45 0-90 0-134 0-23 0-45 11-45 37 0 11 6 19 10 29 12 33 4 71-17 100-38 54-121 61-167 11-23-24-33-60-27-93 2-13 9-24 13-37 5-19-6-39-26-45-21-6-93-2-120-2-28 0-92-8-109 14-15 18-9 90-9 116 0 41 0 81 0 123 0 81 0 164 0 246 0 41 0 82 0 124 0 25-4 63 0 87 2 9 7 17 13 22 7 6 16 9 25 10 25 2 51-1 77-1 41 0 81 1 123 1 51 0 103-1 155-1 27 0 55 2 83 1 51-2 102 0 153 0 17 0 35 2 52 0 10-1 19-5 26-11 18-18 11-87 11-113 0-15-4-117 0-122 1-2 3-2 5-2 3 0 7 4 9 5 9 5 19 9 29 12 18 5 37 6 55 3 31-5 59-21 79-44 85-93 12-238-113-223-20 2-44 9-59 23zM538 134c5-3 99 0 114 0 11 0 82-2 86 3s0 17 0 24c-2 46 0 94 0 141 0 22-3 44-1 66 1 6 2 11 5 16 7 14 23 20 38 18 10-2 19-10 28-13 34-15 74-12 103 11 50 38 50 115 6 157-22 22-53 33-84 30-29-3-59-36-85-12-6 5-11 13-12 21-3 18 0 39 0 58 0 46 0 93 0 140 0 4 2 15-2 18-2 2-82 1-92 1-39 0-77 0-115 0-77 0-154 0-230 0-38 0-77 0-114 0-13 0-94 3-99-1-4-2-3-8-3-12-1-25 0-51 0-75 0-52 0-103 0-154 0-77 0-153 0-229 0-39 0-77 0-115 0-12-3-86 2-90 4-4 16-2 22-2 37 0 76 0 114 0 9 0 56-2 61 0 2 1 3 3 4 5 0 3-11 27-12 32-15 60 12 126 66 156 55 31 125 20 169-24 20-21 35-47 40-76 3-17 3-34-1-52-1-6-13-34-12-36 1-3 1-4 4-6z" fill="#012473" stroke="#012473"/></g></svg>
CSS background-image
.extension {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/hrAoVZVPcI7I/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.extension {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/hrAoVZVPcI7I/amnt.svg") center / contain no-repeat;
}
React
import ExtensionSvg from "./extension.jsx"; // from the React tab above

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

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Extension: A puzzle piece with one rounded tab and one open notch. A flat colour 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