weather moon icon

weather-moon-48-regular from Fluent UI System Icons by Microsoft Corporation · 48 Regular · MIT Free for personal and commercial use.

Name
weather-moon-48-regular
Set
Fluent UI System Icons
Style
48 Regular
Viewbox
48×48
License
MIT

14 other variants in Fluent UI System Icons

weather-moon-12-filledweather-moon-12-regularweather-moon-16-filledweather-moon-16-regularweather-moon-20-filledweather-moon-20-regularweather-moon-24-filledweather-moon-24-regularweather-moon-28-filledweather-moon-28-regularweather-moon-32-filledweather-moon-32-lightweather-moon-32-regularweather-moon-48-filled

Related icons in Fluent UI System Icons

weather-blowing-snow-20-filledweather-cloudy-20-filledweather-drizzle-20-filledweather-duststorm-20-filledweather-fog-20-filledweather-hail-day-20-filledweather-hail-night-20-filledweather-haze-20-filledweather-humidity-12-filledweather-moon-off-16-filledweather-partly-cloudy-day-16-filledweather-partly-cloudy-night-20-filledweather-rain-20-filledweather-rain-showers-day-20-filledweather-rain-showers-night-20-filledweather-rain-snow-20-filledweather-snow-20-filledweather-snow-shower-day-20-filledweather-snow-shower-night-20-filledweather-snowflake-20-filledweather-squalls-20-filledweather-sunny-16-filledweather-sunny-high-20-filledweather-sunny-low-20-filled

Use the weather moon icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37.903 33.01c-4.971 8.609-15.98 11.558-24.589 6.588a17.9 17.9 0 0 1-5.821-5.368a1.35 1.35 0 0 1 .656-2.036c6.78-2.427 10.412-5.24 12.52-9.262c2.218-4.235 2.791-8.873 1.24-15.232a1.35 1.35 0 0 1 1.383-1.668c2.802.15 5.54.956 8.022 2.389c8.61 4.97 11.56 15.979 6.589 24.588m-15.02-8.918C20.58 28.49 16.771 31.523 10.457 34a15.5 15.5 0 0 0 4.107 3.434c7.414 4.28 16.893 1.74 21.173-5.674c4.28-7.413 1.74-16.893-5.673-21.173a15.5 15.5 0 0 0-4.907-1.818l-.468-.08c1.193 5.967.591 10.829-1.806 15.404"/></svg>

React

import type { SVGProps } from "react";

export function FluentWeatherMoon48Regular(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37.903 33.01c-4.971 8.609-15.98 11.558-24.589 6.588a17.9 17.9 0 0 1-5.821-5.368a1.35 1.35 0 0 1 .656-2.036c6.78-2.427 10.412-5.24 12.52-9.262c2.218-4.235 2.791-8.873 1.24-15.232a1.35 1.35 0 0 1 1.383-1.668c2.802.15 5.54.956 8.022 2.389c8.61 4.97 11.56 15.979 6.589 24.588m-15.02-8.918C20.58 28.49 16.771 31.523 10.457 34a15.5 15.5 0 0 0 4.107 3.434c7.414 4.28 16.893 1.74 21.173-5.674c4.28-7.413 1.74-16.893-5.673-21.173a15.5 15.5 0 0 0-4.907-1.818l-.468-.08c1.193 5.967.591 10.829-1.806 15.404"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37.903 33.01c-4.971 8.609-15.98 11.558-24.589 6.588a17.9 17.9 0 0 1-5.821-5.368a1.35 1.35 0 0 1 .656-2.036c6.78-2.427 10.412-5.24 12.52-9.262c2.218-4.235 2.791-8.873 1.24-15.232a1.35 1.35 0 0 1 1.383-1.668c2.802.15 5.54.956 8.022 2.389c8.61 4.97 11.56 15.979 6.589 24.588m-15.02-8.918C20.58 28.49 16.771 31.523 10.457 34a15.5 15.5 0 0 0 4.107 3.434c7.414 4.28 16.893 1.74 21.173-5.674c4.28-7.413 1.74-16.893-5.673-21.173a15.5 15.5 0 0 0-4.907-1.818l-.468-.08c1.193 5.967.591 10.829-1.806 15.404"/></svg>
</template>

CSS

.icon-weather-moon-48-regular {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M37.903%2033.01c-4.971%208.609-15.98%2011.558-24.589%206.588a17.9%2017.9%200%200%201-5.821-5.368a1.35%201.35%200%200%201%20.656-2.036c6.78-2.427%2010.412-5.24%2012.52-9.262c2.218-4.235%202.791-8.873%201.24-15.232a1.35%201.35%200%200%201%201.383-1.668c2.802.15%205.54.956%208.022%202.389c8.61%204.97%2011.56%2015.979%206.589%2024.588m-15.02-8.918C20.58%2028.49%2016.771%2031.523%2010.457%2034a15.5%2015.5%200%200%200%204.107%203.434c7.414%204.28%2016.893%201.74%2021.173-5.674c4.28-7.413%201.74-16.893-5.673-21.173a15.5%2015.5%200%200%200-4.907-1.818l-.468-.08c1.193%205.967.591%2010.829-1.806%2015.404%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M37.903%2033.01c-4.971%208.609-15.98%2011.558-24.589%206.588a17.9%2017.9%200%200%201-5.821-5.368a1.35%201.35%200%200%201%20.656-2.036c6.78-2.427%2010.412-5.24%2012.52-9.262c2.218-4.235%202.791-8.873%201.24-15.232a1.35%201.35%200%200%201%201.383-1.668c2.802.15%205.54.956%208.022%202.389c8.61%204.97%2011.56%2015.979%206.589%2024.588m-15.02-8.918C20.58%2028.49%2016.771%2031.523%2010.457%2034a15.5%2015.5%200%200%200%204.107%203.434c7.414%204.28%2016.893%201.74%2021.173-5.674c4.28-7.413%201.74-16.893-5.673-21.173a15.5%2015.5%200%200%200-4.907-1.818l-.468-.08c1.193%205.967.591%2010.829-1.806%2015.404%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/weather-moon-48-regular.svg?color=%231a73e8&size=48