Sun icon
A free sun icon in 5 styles, drawn by hand on a 24px grid. Copy it as SVG or JSX, for personal or commercial use.
- Size
- 24 × 24, scales to any size
- License
- Free, credit optional (terms)
- Tags
- weather, solar, sunshine, daylight, bright, summer, sunrise
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path transform="translate(1 1)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M11 17C14.31 17 17 14.31 17 11C17 7.69 14.31 5 11 5C7.69 5 5 7.69 5 11C5 14.31 7.69 17 11 17Z"/>
<path transform="translate(1 1)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M11 22L11 21M3.22 18.78L3.93 18.07M0 11L1 11M3.22 3.22L3.93 3.93M11 1L11 0M18.07 3.93L18.78 3.22M21 11L22 11M18.07 18.07L18.78 18.78"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path transform="translate(0 0)" fill="currentColor" d="M12 0C12.55 0 13 0.45 13 1L13 2C13 2.55 12.55 3 12 3C11.45 3 11 2.55 11 2L11 1C11 0.45 11.45 0 12 0Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M3.51 3.51C3.91 3.12 4.54 3.12 4.93 3.51L5.64 4.22C6.03 4.61 6.03 5.25 5.64 5.64C5.25 6.03 4.61 6.03 4.22 5.64L3.51 4.93C3.12 4.54 3.12 3.91 3.51 3.51Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M20.49 3.51C20.88 3.91 20.88 4.54 20.49 4.93L19.78 5.64C19.39 6.03 18.75 6.03 18.36 5.64C17.97 5.25 17.97 4.61 18.36 4.22L19.07 3.51C19.46 3.12 20.09 3.12 20.49 3.51Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M0 12C0 11.45 0.45 11 1 11L2 11C2.55 11 3 11.45 3 12C3 12.55 2.55 13 2 13L1 13C0.45 13 0 12.55 0 12Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M21 12C21 11.45 21.45 11 22 11L23 11C23.55 11 24 11.45 24 12C24 12.55 23.55 13 23 13L22 13C21.45 13 21 12.55 21 12Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M5.64 18.36C6.03 18.75 6.03 19.39 5.64 19.78L4.93 20.49C4.54 20.88 3.91 20.88 3.51 20.49C3.12 20.09 3.12 19.46 3.51 19.07L4.22 18.36C4.61 17.97 5.25 17.97 5.64 18.36Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M18.36 18.36C18.75 17.97 19.39 17.97 19.78 18.36L20.49 19.07C20.88 19.46 20.88 20.09 20.49 20.49C20.09 20.88 19.46 20.88 19.07 20.49L18.36 19.78C17.97 19.39 17.97 18.75 18.36 18.36Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M12 21C12.55 21 13 21.45 13 22L13 23C13 23.55 12.55 24 12 24C11.45 24 11 23.55 11 23L11 22C11 21.45 11.45 21 12 21Z"/>
<path transform="translate(0 0)" fill="currentColor" d="M5 12C5 8.13 8.13 5 12 5C15.87 5 19 8.13 19 12C19 15.87 15.87 19 12 19C8.13 19 5 15.87 5 12Z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path opacity="0.28" transform="translate(6 6)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M12 6C12 9.31 9.31 12 6 12C2.69 12 0 9.31 0 6C0 2.69 2.69 0 6 0C9.31 0 12 2.69 12 6Z"/>
<path transform="translate(1 1)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M11 22L11 21M3.22 18.78L3.93 18.07M0 11L1 11M3.22 3.22L3.93 3.93M11 1L11 0M18.07 3.93L18.78 3.22M21 11L22 11M18.07 18.07L18.78 18.78"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path opacity="0.28" transform="translate(5 5)" fill="currentColor" d="M7 0C3.13 0 0 3.13 0 7C0 10.87 3.13 14 7 14C10.87 14 14 10.87 14 7C14 3.13 10.87 0 7 0Z"/>
<path transform="translate(0 0)" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M12 0C12.55 0 13 0.45 13 1L13 2C13 2.55 12.55 3 12 3C11.45 3 11 2.55 11 2L11 1C11 0.45 11.45 0 12 0ZM3.51 3.51C3.91 3.12 4.54 3.12 4.93 3.51L5.64 4.22C6.03 4.61 6.03 5.25 5.64 5.64C5.25 6.03 4.61 6.03 4.22 5.64L3.51 4.93C3.12 4.54 3.12 3.91 3.51 3.51ZM20.49 3.51C20.88 3.91 20.88 4.54 20.49 4.93L19.78 5.64C19.39 6.03 18.75 6.03 18.36 5.64C17.97 5.25 17.97 4.61 18.36 4.22L19.07 3.51C19.46 3.12 20.09 3.12 20.49 3.51ZM0 12C0 11.45 0.45 11 1 11L2 11C2.55 11 3 11.45 3 12C3 12.55 2.55 13 2 13L1 13C0.45 13 0 12.55 0 12ZM21 12C21 11.45 21.45 11 22 11L23 11C23.55 11 24 11.45 24 12C24 12.55 23.55 13 23 13L22 13C21.45 13 21 12.55 21 12ZM5.64 18.36C6.03 18.75 6.03 19.39 5.64 19.78L4.93 20.49C4.54 20.88 3.91 20.88 3.51 20.49C3.12 20.09 3.12 19.46 3.51 19.07L4.22 18.36C4.61 17.97 5.25 17.97 5.64 18.36ZM18.36 18.36C18.75 17.97 19.39 17.97 19.78 18.36L20.49 19.07C20.88 19.46 20.88 20.09 20.49 20.49C20.09 20.88 19.46 20.88 19.07 20.49L18.36 19.78C17.97 19.39 17.97 18.75 18.36 18.36ZM12 21C12.55 21 13 21.45 13 22L13 23C13 23.55 12.55 24 12 24C11.45 24 11 23.55 11 23L11 22C11 21.45 11.45 21 12 21Z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path opacity="0.28" transform="translate(6 6)" fill="currentColor" d="M6 12C9.31 12 12 9.31 12 6C12 2.69 9.31 0 6 0C2.69 0 0 2.69 0 6C0 9.31 2.69 12 6 12Z"/>
<path transform="translate(1 1)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M17 11C17 14.31 14.31 17 11 17C7.69 17 5 14.31 5 11C5 7.69 7.69 5 11 5C14.31 5 17 7.69 17 11Z"/>
<path transform="translate(1 1)" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M11 22L11 21M3.22 18.78L3.93 18.07M0 11L1 11M3.22 3.22L3.93 3.93M11 1L11 0M18.07 3.93L18.78 3.22M21 11L22 11M18.07 18.07L18.78 18.78"/>
</svg>
More Weather & Climate icons
In the full library
- Cloud Lightning
- Cloud Moon
- Cloud Snow
- Cloud Wind
- Leaf
- Lightning Thunder Electric Off
- Sunrise Down
- Sunrise Up
- Water Double Droplet
- Water Triple Droplet
Get the full library
5,000+ icons across five styles, with the Figma file and the Pikaicons app, for one payment from $99. 500+ of them are free to copy here.
