Menu

Beta
Sign in
Beta
Rainbow SVG icon, line

Rainbow SVG icon, line

Three nested arches end along the same baseline. It can mark rainbow sightings in nature journals or weather activities in classroom worksheets.

Free · from Weather icons, line · Set 2

Similar SVGs

More from Weather icons, line · Set 2

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/egJOuHdtaMPe/amnt.svg" alt="Rainbow" 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="red" data-name="Red"><path d="M960 710c0-188-95-366-269-447-56-26-118-41-179-41s-122 14-177 40c-175 82-271 258-271 448h73c0-210 154-410 376-410 220 0 374 201 374 410z" fill="#fc0202" stroke="#fc0202"/></g><g id="orange" data-name="Orange"><path d="M844 710c0-185-139-360-332-360-194 0-332 175-332 360h69c0-147 109-288 264-288 148 0 266 143 262 288z" fill="#fd8401" stroke="#fd8401"/></g><g id="yellow" data-name="Yellow"><path d="M733 710c-3-123-89-243-221-242-128 1-222 120-221 242h69c0-84 60-171 152-171 90 0 152 86 152 171z" fill="#fde902" stroke="#fde902"/></g><g id="black" data-name="Black"><path d="M486 212c-251 14-432 245-432 487 0 31 5 22 36 22 8 0 50 2 55-2 3-3 3-45 4-53 2-17 4-33 8-50 12-56 37-111 71-157 71-96 189-158 309-148 116 10 222 80 280 179 31 53 51 112 57 173 7 67-13 58 58 58 6 0 31 2 35-1 7-5 1-61 0-71-24-246-227-450-481-437zM960 710h-73c0-209-154-410-374-410-222 0-376 200-376 410h-73c0-190 96-366 271-448 55-26 116-40 177-40s123 15 179 41c174 81 269 259 269 447z" fill="#030202" stroke="#030202"/><path d="M500 339c-183 8-322 171-331 349 0 5-2 26 1 30 3 5 42 3 51 3 51 0 35 2 41-44 4-44 19-88 43-125 48-74 130-124 219-119 88 4 162 60 204 135 23 41 34 88 36 135 0 4-2 12 2 16s55 2 65 2c5 0 18 2 22-2 6-5 0-45-1-55-21-177-166-333-352-325zM844 710h-69c4-145-114-288-262-288-155 0-264 141-264 288h-69c0-185 138-360 332-360 193 0 332 175 332 360z" fill="#030202" stroke="#030202"/><path d="M505 457c-121 6-212 110-223 226-1 7-4 31 0 36 4 4 62 2 72 2 4 0 12 1 15-3 4-5 1-20 2-26 2-18 6-36 13-52 23-53 76-93 134-90 59 3 106 47 126 100 4 14 8 28 9 43 0 6-2 16 0 22 1 2 1 4 3 5 5 4 22 1 29 1 8 0 53 2 57-3s0-40-1-48c-19-114-114-218-236-213zM733 710h-69c0-85-62-171-152-171-92 0-152 87-152 171h-69c-1-122 93-241 221-242 132-1 218 119 221 242z" fill="#030202" stroke="#030202"/></g></svg>
CSS background-image
.rainbow {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/egJOuHdtaMPe/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.rainbow {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/egJOuHdtaMPe/amnt.svg") center / contain no-repeat;
}
React
import RainbowSvg from "./rainbow.jsx"; // from the React tab above

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

Tags

rainbowarchweatherskyiconline

Made with AMNT

AMNT Draw 1.2 drew this from the words Rainbow: Three nested arches ending at the same baseline. A flat colour icon. as part of the pack Weather 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