Add icons to this collection by clicking the heart icon.
Umbrella icon - also known as weather, protection, rainy, rain, umbrella, Tools and utensils, and umbrellas. Created in a clean lineal gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="100"
height="100"
viewBox="0 0 495.912 495.912"
>
<linearGradient
id="a"
x1="-70.822"
x2="11.848"
y1="575.624"
y2="658.294"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M191.956 55.902a8 8 0 0 0 5.656-2.344l40-40A8 8 0 0 0 226.3 2.246l-40 40a8 8 0 0 0 5.656 13.656z"
fill="url(#a)"
/>
<linearGradient
id="b"
x1="-75.822"
x2="6.848"
y1="580.624"
y2="663.294"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M111.956 55.902a8 8 0 0 0 5.656-2.344l40-40A8 8 0 0 0 146.3 2.246l-40 40a8 8 0 0 0 5.656 13.656z"
fill="url(#b)"
/>
<linearGradient
id="c"
x1="-65.822"
x2="16.848"
y1="570.624"
y2="653.294"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M271.956 55.902a8 8 0 0 0 5.656-2.344l40-40A8 8 0 0 0 306.3 2.246l-40 40a8 8 0 0 0 5.656 13.656z"
fill="url(#c)"
/>
<linearGradient
id="d"
x1="-60.823"
x2="21.85"
y1="565.625"
y2="648.295"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M351.956 55.902a8 8 0 0 0 5.656-2.344l40-40A8 8 0 0 0 386.3 2.246l-40 40a8 8 0 0 0 5.656 13.656z"
fill="url(#d)"
/>
<linearGradient
id="e"
x1="-57.688"
x2="24.982"
y1="562.487"
y2="645.159"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M247.956 63.902c-105.864 0-192 75.36-192 168a8 8 0 0 0 16 0c0-83.816 78.952-152 176-152s176 68.184 176 152a8 8 0 0 0 16 0c0-92.64-86.136-168-192-168z"
fill="url(#e)"
/>
<linearGradient
id="f"
x1="-45.598"
x2="37.073"
y1="550.397"
y2="633.069"
gradientTransform="matrix(8 0 0 -8 399.307 5012.117)"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#aa6100" />
<stop offset=".093" stop-color="#ac6400" />
<stop offset=".165" stop-color="#b26e00" />
<stop offset=".231" stop-color="#bb7e00" />
<stop offset=".292" stop-color="#c99600" />
<stop offset=".35" stop-color="#dbb400" />
<stop offset=".405" stop-color="#f0d800" />
<stop offset=".439" stop-color="#fff200" />
<stop offset=".474" stop-color="#ffd705" />
<stop offset=".519" stop-color="#ffbb0a" />
<stop offset=".565" stop-color="#ffa80e" />
<stop offset=".611" stop-color="#ff9c10" />
<stop offset=".658" stop-color="#ff9811" />
<stop offset=".732" stop-color="#ff9a12" />
<stop offset=".758" stop-color="#ffa118" />
<stop offset=".777" stop-color="#ffac21" />
<stop offset=".793" stop-color="#ffbd2e" />
<stop offset=".806" stop-color="#ffd33f" />
<stop offset=".809" stop-color="#ffda44" />
<stop offset=".879" stop-color="#dda928" />
<stop offset=".96" stop-color="#b8750b" />
<stop offset="1" stop-color="#aa6100" />
</linearGradient>
<path
d="M359.956 423.342h-.08a8 8 0 0 0-7.92 8.079v.001c.274 26.508-20.993 48.22-47.501 48.494a47.99 47.99 0 0 1-6.099-.326c-24.533-3.4-42.703-24.523-42.4-49.288v-206.4a8 8 0 0 0-16 0v206.512c-.235 32.886 24.073 60.793 56.68 65.072 35.114 4.045 66.858-21.142 70.903-56.256.305-2.647.444-5.311.417-7.976a8 8 0 0 0-8-7.912z"
fill="url(#f)"
/>
</svg>
More icons in the same style and category