Moon Icon SVG

Moon SVG Icons refers to an object that shines in the night sky and orbits the earth once every 28 days.

Get Free Moon Icon SVG code vector files and use them in websites, apps (Android/IOS), ppt, and other useful projects. Customize & Download the Moon Icon SVG file (HMTL/CSS) in different colors and sizes. Moon SVG icon white, black, red, green, blue, transparent, and other colors.

Moon Icon Svg Code | Path | Download

Download free Moon SVG icons in different sizes (16*16, 24*24, 32*32, 64*64 & Other). Check and download the Moon Icon SVG code in HTML/Css from below.

Moon SVG Icon Code | Customize color

You can get svg icon moon in blue, white, red color and transparent color from below list. You can also customize color using color picker.

Moon

Download

Svg Code

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"/> </svg>

Moon

Download

Svg Code

<svg style='color: white' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"/> </svg>

Moon

Download

Svg Code

<svg style='color: red' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"/> </svg>

Moon

Download

Svg Code

<svg style='color: blue' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"/> </svg>

Moon

Download

Svg Code

<svg style='color: #f3da35' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon" viewBox="0 0 16 16"> <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278zM4.858 1.311A7.269 7.269 0 0 0 1.025 7.71c0 4.02 3.279 7.276 7.319 7.276a7.316 7.316 0 0 0 5.205-2.162c-.337.042-.68.063-1.029.063-4.61 0-8.343-3.714-8.343-8.29 0-1.167.242-2.278.681-3.286z"/> </svg>


Advance Editor

You can edit moon as below. Change size color and background color of icon using below tool.

fontawesomeicons.com
Size
Stroke

Size
Stroke
tab 2 content
Tab 3 content



Tags

crescent,half-moon,planetoid,pumpkin,satellite,celestial body,full moon,heavenly body,new moon

How to add Moon SVG Icon?

Here are the five important steps to add this SVG icon.

  • Customize your Moon SVG Icon color, size, and shape.
  • Click on the download Moon SVG Code File Button.
  • Now, SVG Moon Icon will be downloaded to your device.
  • Upload this Moon icon SVG file in your desired projects.
  • Moon SVG Icon uses - Websites, Apps, PPT, & Other Projects.


Advertisements



Moon Icon SVG - Faq(s)?

⭐Can I get Free Moon Icon SVG?

Yes, you can get free Moon SVG icons.

⭐ How to download free Moon Icon SVG code?

To download free Moon icons in SVG code click on the copy code button.

⭐How to find the Moon Icon SVG path file?

You can get the Moon SVG file path from the above section.

⭐ What are the colors available for SVG Moon Icon?

You can check the Moon SVG in your brand color i.e, White, Black, Blue, Red, Green, Pink & Yellow.



Advertisements

You may like these icons


Looking For More Icons?