Weather Snow Shower Night icon

Use the Weather Snow Shower Night icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.

npm install @fluentui/react-icons

import { WeatherSnowShowerNight24Regular, WeatherSnowShowerNight24Filled } from "@fluentui/react-icons";

export function Example() {
  return <WeatherSnowShowerNight24Regular aria-label="Weather Snow Shower Night" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_weather_snow_shower_night_24_regular.svg" width="24" height="24" alt="Weather Snow Shower Night">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.7501 20.0034C11.1643 20.0034 11.5001 20.3392 11.5001 20.7534C11.5001 21.1677 11.1643 21.5034 10.7501 21.5034C10.3359 21.5034 10.0001 21.1677 10.0001 20.7534C10.0001 20.3392 10.3359 20.0034 10.7501 20.0034ZM15.2501 20.0034C15.6643 20.0034 16.0001 20.3392 16.0001 20.7534C16.0001 21.1677 15.6643 21.5034 15.2501 21.5034C14.8359 21.5034 14.5001 21.1677 14.5001 20.7534C14.5001 20.3392 14.8359 20.0034 15.2501 20.0034ZM8.50008 19.0034C8.91429 19.0034 9.25008 19.3392 9.25008 19.7534C9.25008 20.1677 8.91429 20.5034 8.50008 20.5034C8.08587 20.5034 7.75008 20.1677 7.75008 19.7534C7.75008 19.3392 8.08587 19.0034 8.50008 19.0034ZM13.0001 19.0034C13.4143 19.0034 13.7501 19.3392 13.7501 19.7534C13.7501 20.1677 13.4143 20.5034 13.0001 20.5034C12.5859 20.5034 12.2501 20.1677 12.2501 19.7534C12.2501 19.3392 12.5859 19.0034 13.0001 19.0034ZM17.5001 19.0034C17.9143 19.0034 18.2501 19.3392 18.2501 19.7534C18.2501 20.1677 17.9143 20.5034 17.5001 20.5034C17.0859 20.5034 16.7501 20.1677 16.7501 19.7534C16.7501 19.3392 17.0859 19.0034 17.5001 19.0034ZM13.0012 6.01769C16.1697 6.01769 17.9672 8.11498 18.2286 10.6478L18.3086 10.6478C20.3476 10.6478 22.0006 12.2965 22.0006 14.3303C22.0006 16.3641 20.3476 18.0129 18.3086 18.0129H7.69384C5.65476 18.0129 4.00175 16.3641 4.00175 14.3303C4.00175 12.2965 5.65476 10.6478 7.69386 10.6478L7.7738 10.6478C8.03674 8.09834 9.83267 6.01769 13.0012 6.01769ZM13.0012 7.51528C10.9299 7.51528 9.12449 9.14852 9.12449 11.4045C9.12449 11.762 8.80554 12.0424 8.44033 12.0424L7.74977 12.0424C6.48878 12.0424 5.46655 13.0437 5.46655 14.2788C5.46655 15.514 6.48878 16.5153 7.74977 16.5153H18.2526C19.5136 16.5153 20.5359 15.514 20.5359 14.2788C20.5359 13.0437 19.5136 12.0424 18.2527 12.0424L17.5621 12.0424C17.1969 12.0424 16.8779 11.762 16.8779 11.4045C16.8779 9.11959 15.0725 7.51528 13.0012 7.51528ZM6.58848 2.00991C7.3835 2.05256 8.15547 2.28167 8.85156 2.68357C9.90612 3.29242 10.6596 4.22246 11.0599 5.27879C10.5594 5.41966 10.0968 5.6165 9.67393 5.86279C9.39833 5.0977 8.86049 4.42246 8.10083 3.98387C7.90277 3.86952 7.69629 3.77503 7.48357 3.70101C7.64409 5.05264 7.43604 6.21423 6.86109 7.31175L6.74314 7.52478C6.17223 8.50119 5.31122 9.23253 4.02489 9.82922C4.18042 9.95829 4.34756 10.0746 4.52512 10.1772C4.70992 10.2839 4.9003 10.3722 5.09412 10.4427C4.64384 10.7444 4.24932 11.124 3.92881 11.5618L3.77436 11.4775C3.11685 11.0978 2.55868 10.5823 2.13224 9.96313C1.85275 9.55721 2.03356 8.9966 2.49759 8.83055C4.14001 8.2427 5.02493 7.58116 5.53104 6.61498C6.08379 5.5599 6.18589 4.44092 5.81892 2.93754C5.69961 2.44854 6.08586 1.98294 6.58848 2.00991Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/weather_snow_shower_night_24_regular.svg";

Details

Keywords

dailyskysnowwindcloudsunrainmoonlightninghaze