cloudy night icon

cloudy-night-sharp from IonIcons by Ben Sperry · Sharp · MIT Free for personal and commercial use.

Name: cloudy-night-sharp
Set: IonIcons
Style: Sharp
Viewbox: 512×512
License: MIT

2 other variants in IonIcons

The same icon in other sets

cloudy-nightIconPark cloudy-nightIconPark Outline cloudy-nightIconPark Solid cloudy-nightIconPark TwoTone cloudy-nightTDesign Icons

Use the cloudy night icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M340 480H106c-29.5 0-54.92-7.83-73.53-22.64C11.23 440.44 0 415.35 0 384.8c0-29.44 12.09-54.25 35-71.74c14.55-11.13 33.41-18.87 53.2-22c6.06-36.92 21.92-68.53 46.29-92A139.82 139.82 0 0 1 232 160c32.33 0 62.15 10.65 86.24 30.79a142.4 142.4 0 0 1 40.83 57.05c27.18 4.48 51.59 15.68 69.56 32.08C451.77 301 464 329.82 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.55-260.07c26.5 6.93 50 19.32 68.65 36.34q3.89 3.56 7.47 7.34c25.41-18.4 45.47-44.92 54.33-71.38c-16.24 7.07-35.31 9.85-54.15 9.85c-73.42 0-115.93-42.51-115.93-115.93c0-18.84 2.78-37.91 9.85-54.15c-40.41 13.53-81 53.19-92.52 98.13a162.6 162.6 0 0 1 79.52 36.12a173 173 0 0 1 42.78 53.68"/></svg>

React

import type { SVGProps } from "react";

export function IonCloudyNightSharp(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M340 480H106c-29.5 0-54.92-7.83-73.53-22.64C11.23 440.44 0 415.35 0 384.8c0-29.44 12.09-54.25 35-71.74c14.55-11.13 33.41-18.87 53.2-22c6.06-36.92 21.92-68.53 46.29-92A139.82 139.82 0 0 1 232 160c32.33 0 62.15 10.65 86.24 30.79a142.4 142.4 0 0 1 40.83 57.05c27.18 4.48 51.59 15.68 69.56 32.08C451.77 301 464 329.82 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.55-260.07c26.5 6.93 50 19.32 68.65 36.34q3.89 3.56 7.47 7.34c25.41-18.4 45.47-44.92 54.33-71.38c-16.24 7.07-35.31 9.85-54.15 9.85c-73.42 0-115.93-42.51-115.93-115.93c0-18.84 2.78-37.91 9.85-54.15c-40.41 13.53-81 53.19-92.52 98.13a162.6 162.6 0 0 1 79.52 36.12a173 173 0 0 1 42.78 53.68"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M340 480H106c-29.5 0-54.92-7.83-73.53-22.64C11.23 440.44 0 415.35 0 384.8c0-29.44 12.09-54.25 35-71.74c14.55-11.13 33.41-18.87 53.2-22c6.06-36.92 21.92-68.53 46.29-92A139.82 139.82 0 0 1 232 160c32.33 0 62.15 10.65 86.24 30.79a142.4 142.4 0 0 1 40.83 57.05c27.18 4.48 51.59 15.68 69.56 32.08C451.77 301 464 329.82 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.55-260.07c26.5 6.93 50 19.32 68.65 36.34q3.89 3.56 7.47 7.34c25.41-18.4 45.47-44.92 54.33-71.38c-16.24 7.07-35.31 9.85-54.15 9.85c-73.42 0-115.93-42.51-115.93-115.93c0-18.84 2.78-37.91 9.85-54.15c-40.41 13.53-81 53.19-92.52 98.13a162.6 162.6 0 0 1 79.52 36.12a173 173 0 0 1 42.78 53.68"/></svg>
</template>

CSS

.icon-cloudy-night-sharp {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M340%20480H106c-29.5%200-54.92-7.83-73.53-22.64C11.23%20440.44%200%20415.35%200%20384.8c0-29.44%2012.09-54.25%2035-71.74c14.55-11.13%2033.41-18.87%2053.2-22c6.06-36.92%2021.92-68.53%2046.29-92A139.82%20139.82%200%200%201%20232%20160c32.33%200%2062.15%2010.65%2086.24%2030.79a142.4%20142.4%200%200%201%2040.83%2057.05c27.18%204.48%2051.59%2015.68%2069.56%2032.08C451.77%20301%20464%20329.82%20464%20363.2c0%2032.85-13.13%2062.87-37%2084.52c-22.89%2020.82-53.8%2032.28-87%2032.28m41.55-260.07c26.5%206.93%2050%2019.32%2068.65%2036.34q3.89%203.56%207.47%207.34c25.41-18.4%2045.47-44.92%2054.33-71.38c-16.24%207.07-35.31%209.85-54.15%209.85c-73.42%200-115.93-42.51-115.93-115.93c0-18.84%202.78-37.91%209.85-54.15c-40.41%2013.53-81%2053.19-92.52%2098.13a162.6%20162.6%200%200%201%2079.52%2036.12a173%20173%200%200%201%2042.78%2053.68%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M340%20480H106c-29.5%200-54.92-7.83-73.53-22.64C11.23%20440.44%200%20415.35%200%20384.8c0-29.44%2012.09-54.25%2035-71.74c14.55-11.13%2033.41-18.87%2053.2-22c6.06-36.92%2021.92-68.53%2046.29-92A139.82%20139.82%200%200%201%20232%20160c32.33%200%2062.15%2010.65%2086.24%2030.79a142.4%20142.4%200%200%201%2040.83%2057.05c27.18%204.48%2051.59%2015.68%2069.56%2032.08C451.77%20301%20464%20329.82%20464%20363.2c0%2032.85-13.13%2062.87-37%2084.52c-22.89%2020.82-53.8%2032.28-87%2032.28m41.55-260.07c26.5%206.93%2050%2019.32%2068.65%2036.34q3.89%203.56%207.47%207.34c25.41-18.4%2045.47-44.92%2054.33-71.38c-16.24%207.07-35.31%209.85-54.15%209.85c-73.42%200-115.93-42.51-115.93-115.93c0-18.84%202.78-37.91%209.85-54.15c-40.41%2013.53-81%2053.19-92.52%2098.13a162.6%20162.6%200%200%201%2079.52%2036.12a173%20173%200%200%201%2042.78%2053.68%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/cloudy-night-sharp.svg?color=%231a73e8&size=48