Add icons to this collection by clicking the heart icon.
Eclipse icon - also known as nature, weather, astronomy, moon, eclipse, moon phase, and meteorology. Created in a clean flat 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="512"
height="512"
viewBox="0 0 96 96"
>
<linearGradient
id="a"
x1="66.17"
x2="19.67"
y1="48"
y2="48"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffb300" />
<stop offset=".27" stop-color="#ffba11" />
<stop offset=".8" stop-color="#ffcd3c" />
<stop offset="1" stop-color="#ffd54f" />
</linearGradient>
<linearGradient
id="b"
x1="52.38"
x2="87.37"
y1="48"
y2="48"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#0f2027" />
<stop offset=".32" stop-color="#193038" />
<stop offset=".5" stop-color="#203a43" />
<stop offset="1" stop-color="#2c5364" />
</linearGradient>
<linearGradient id="c" x1="48" x2="48" y1="15.67" y2="6.99" href="#a" />
<linearGradient id="d" x1="46" x2="50" y1="4" y2="4" href="#a" />
<linearGradient id="e" x1="35.5" x2="1" y1="16.39" y2="16.39" href="#a" />
<linearGradient id="f" x1="35.5" x2="1" y1="29.75" y2="29.75" href="#a" />
<linearGradient id="g" x1="7.89" x2="11.9" y1="26" y2="26" href="#a" />
<linearGradient id="h" x1="35.5" x2="1" y2="48" href="#a" />
<linearGradient id="i" x1="35.5" x2="1" y1="66.25" y2="66.25" href="#a" />
<linearGradient id="j" x1="7.89" x2="11.9" y1="70" y2="70" href="#a" />
<linearGradient id="k" x1="35.5" x2="1" y1="79.61" y2="79.61" href="#a" />
<linearGradient id="l" x1="48" x2="48" y1="81" y2="88" href="#a" />
<linearGradient id="m" x1="46" x2="50" y1="92" y2="92" href="#a" />
<path
fill="url(#a)"
d="M62.43 71.9a27.4 27.4 0 0 1-7-5.28 27.37 27.37 0 0 1-4.62-6.55 26.87 26.87 0 0 1-2.7-9.4C48 49.75 48 48.88 48 48a26.93 26.93 0 0 1 14.43-23.9 2 2 0 0 0 0-3.54 31 31 0 1 0 0 54.88 2 2 0 0 0 0-3.54z"
/>
<path
fill="url(#b)"
d="M78.85 45a31 31 0 0 0-16.42-24.44 2 2 0 0 0-1.86 0 31 31 0 0 0 0 54.88 2 2 0 0 0 1.86 0A30.92 30.92 0 0 0 78.85 45z"
/>
<path
fill="url(#c)"
d="M48 15a2 2 0 0 1-2-2v-3a2 2 0 0 1 4 0v3a2 2 0 0 1-2 2z"
/>
<circle cx="48" cy="4" r="2" fill="url(#d)" />
<path
fill="url(#e)"
d="M30.5 19.69a2 2 0 0 1-1.73-1l-1.5-2.6a2 2 0 0 1 3.46-2l1.5 2.6a2 2 0 0 1-1.73 3z"
/>
<path
fill="url(#f)"
d="M17.69 32.5a2 2 0 0 1-1-.27l-2.6-1.5a2 2 0 1 1 2-3.46l2.6 1.5a2 2 0 0 1-1 3.73z"
/>
<circle cx="9.89" cy="26" r="2" fill="url(#g)" />
<path fill="url(#h)" d="M13 50h-3a2 2 0 0 1 0-4h3a2 2 0 0 1 0 4z" />
<path
fill="url(#i)"
d="M15.09 69a2 2 0 0 1-1-3.73l2.6-1.5a2 2 0 0 1 2 3.46l-2.6 1.5a2 2 0 0 1-1 .27z"
/>
<circle cx="9.89" cy="70" r="2" fill="url(#j)" />
<path
fill="url(#k)"
d="M29 82.91a2 2 0 0 1-1.73-3l1.5-2.6a2 2 0 1 1 3.46 2l-1.5 2.6a2 2 0 0 1-1.73 1z"
/>
<path
fill="url(#l)"
d="M48 88a2 2 0 0 1-2-2v-3a2 2 0 0 1 4 0v3a2 2 0 0 1-2 2z"
/>
<circle cx="48" cy="92" r="2" fill="url(#m)" />
</svg>
More icons in the same style and category