Add icons to this collection by clicking the heart icon.
Sun icon - also known as summer, nature, weather, sunny, warm, summertime, sun, and meteorology. 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 496.098 496.098"
>
<linearGradient
id="a"
x1="-68.638"
x2="10.794"
y1="573.264"
y2="652.694"
gradientTransform="matrix(8 0 0 -8 398.307 5013)"
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="M248.099 56a8 8 0 0 0 8-8V8a8 8 0 0 0-16 0v40a8 8 0 0 0 8 8z"
fill="url(#a)"
/>
<linearGradient
id="b"
x1="-68.638"
x2="10.795"
y1="573.264"
y2="652.694"
gradientTransform="matrix(8 0 0 -8 398.307 5013)"
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="M8.099 256h40a8 8 0 0 0 0-16h-40a8 8 0 0 0 0 16z" fill="url(#b)" />
<linearGradient
id="c"
x1="-74.346"
x2="5.09"
y1="578.97"
y2="658.406"
gradientTransform="matrix(8 0 0 -8 398.307 5013)"
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="M101.019 112.232a8 8 0 0 0 11.312-11.312l-28.28-28.28a8 8 0 1 0-11.312 11.312l28.28 28.28z"
fill="url(#c)"
/>
<linearGradient
id="d"
x1="-62.673"
x2="16.764"
y1="567.295"
y2="646.735"
gradientTransform="matrix(8 0 0 -8 398.307 5013)"
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="M493.755 2.344a8 8 0 0 0-11.312 0L372.307 112.48c-74.722-68.722-191.006-63.859-259.728 10.863-64.694 70.342-64.694 178.523 0 248.865L2.443 482.344a8 8 0 0 0-.196 11.312 8 8 0 0 0 11.508 0l480-480a8 8 0 0 0 0-11.312zM80.099 248c-.087-92.695 74.987-167.91 167.683-167.997a167.844 167.844 0 0 1 113.213 43.789L123.891 360.896A166.708 166.708 0 0 1 80.099 248z"
fill="url(#d)"
/>
<linearGradient
id="e"
x1="-45.858"
x2="33.574"
y1="550.485"
y2="629.918"
gradientTransform="matrix(8 0 0 -8 398.307 5013)"
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="M391.523 137.112a7.85 7.85 0 0 0-6.304 2.336L140.275 385.696a8 8 0 0 0 1.024 12.152c82.729 59.014 197.634 39.79 256.648-42.939 45.817-64.228 45.588-150.517-.568-214.501a8.001 8.001 0 0 0-5.856-3.296z"
fill="url(#e)"
/>
</svg>
More icons in the same style and category