partly sunny icon

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

Name: partly-sunny-sharp
Set: IonIcons
Style: Sharp
Viewbox: 512×512
License: MIT

2 other variants in IonIcons

Use the partly sunny 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-26.66 10.08-49.8 29.14-66.91c15.24-13.68 36.17-23.21 59-26.84c.06 0 .08 0 .09-.05c6.44-39 23.83-72.09 50.31-95.68A140.24 140.24 0 0 1 232 160c30.23 0 58.48 9.39 81.71 27.17a142.7 142.7 0 0 1 45.36 60.66c29.41 4.82 54.72 17.11 73.19 35.54C453 304.11 464 331.71 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.5-260.11a169.2 169.2 0 0 1 45.44 19A96 96 0 0 0 281 129.33q-2.85 2-5.54 4.2a162.5 162.5 0 0 1 57.73 28.23a174.5 174.5 0 0 1 48.31 58.13M448 192h64v32h-64zM320 32h32v64h-32zm-64.65 97.63l12.45-12.45l-44.62-44.63l-22.63 22.63l33.17 33.17h.6a172 172 0 0 1 21.03 1.28m148.853-12.46l44.626-44.625l22.627 22.627l-44.625 44.626z"/></svg>

React

import type { SVGProps } from "react";

export function IonPartlySunnySharp(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-26.66 10.08-49.8 29.14-66.91c15.24-13.68 36.17-23.21 59-26.84c.06 0 .08 0 .09-.05c6.44-39 23.83-72.09 50.31-95.68A140.24 140.24 0 0 1 232 160c30.23 0 58.48 9.39 81.71 27.17a142.7 142.7 0 0 1 45.36 60.66c29.41 4.82 54.72 17.11 73.19 35.54C453 304.11 464 331.71 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.5-260.11a169.2 169.2 0 0 1 45.44 19A96 96 0 0 0 281 129.33q-2.85 2-5.54 4.2a162.5 162.5 0 0 1 57.73 28.23a174.5 174.5 0 0 1 48.31 58.13M448 192h64v32h-64zM320 32h32v64h-32zm-64.65 97.63l12.45-12.45l-44.62-44.63l-22.63 22.63l33.17 33.17h.6a172 172 0 0 1 21.03 1.28m148.853-12.46l44.626-44.625l22.627 22.627l-44.625 44.626z"/></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-26.66 10.08-49.8 29.14-66.91c15.24-13.68 36.17-23.21 59-26.84c.06 0 .08 0 .09-.05c6.44-39 23.83-72.09 50.31-95.68A140.24 140.24 0 0 1 232 160c30.23 0 58.48 9.39 81.71 27.17a142.7 142.7 0 0 1 45.36 60.66c29.41 4.82 54.72 17.11 73.19 35.54C453 304.11 464 331.71 464 363.2c0 32.85-13.13 62.87-37 84.52c-22.89 20.82-53.8 32.28-87 32.28m41.5-260.11a169.2 169.2 0 0 1 45.44 19A96 96 0 0 0 281 129.33q-2.85 2-5.54 4.2a162.5 162.5 0 0 1 57.73 28.23a174.5 174.5 0 0 1 48.31 58.13M448 192h64v32h-64zM320 32h32v64h-32zm-64.65 97.63l12.45-12.45l-44.62-44.63l-22.63 22.63l33.17 33.17h.6a172 172 0 0 1 21.03 1.28m148.853-12.46l44.626-44.625l22.627 22.627l-44.625 44.626z"/></svg>
</template>

CSS

.icon-partly-sunny-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-26.66%2010.08-49.8%2029.14-66.91c15.24-13.68%2036.17-23.21%2059-26.84c.06%200%20.08%200%20.09-.05c6.44-39%2023.83-72.09%2050.31-95.68A140.24%20140.24%200%200%201%20232%20160c30.23%200%2058.48%209.39%2081.71%2027.17a142.7%20142.7%200%200%201%2045.36%2060.66c29.41%204.82%2054.72%2017.11%2073.19%2035.54C453%20304.11%20464%20331.71%20464%20363.2c0%2032.85-13.13%2062.87-37%2084.52c-22.89%2020.82-53.8%2032.28-87%2032.28m41.5-260.11a169.2%20169.2%200%200%201%2045.44%2019A96%2096%200%200%200%20281%20129.33q-2.85%202-5.54%204.2a162.5%20162.5%200%200%201%2057.73%2028.23a174.5%20174.5%200%200%201%2048.31%2058.13M448%20192h64v32h-64zM320%2032h32v64h-32zm-64.65%2097.63l12.45-12.45l-44.62-44.63l-22.63%2022.63l33.17%2033.17h.6a172%20172%200%200%201%2021.03%201.28m148.853-12.46l44.626-44.625l22.627%2022.627l-44.625%2044.626z%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-26.66%2010.08-49.8%2029.14-66.91c15.24-13.68%2036.17-23.21%2059-26.84c.06%200%20.08%200%20.09-.05c6.44-39%2023.83-72.09%2050.31-95.68A140.24%20140.24%200%200%201%20232%20160c30.23%200%2058.48%209.39%2081.71%2027.17a142.7%20142.7%200%200%201%2045.36%2060.66c29.41%204.82%2054.72%2017.11%2073.19%2035.54C453%20304.11%20464%20331.71%20464%20363.2c0%2032.85-13.13%2062.87-37%2084.52c-22.89%2020.82-53.8%2032.28-87%2032.28m41.5-260.11a169.2%20169.2%200%200%201%2045.44%2019A96%2096%200%200%200%20281%20129.33q-2.85%202-5.54%204.2a162.5%20162.5%200%200%201%2057.73%2028.23a174.5%20174.5%200%200%201%2048.31%2058.13M448%20192h64v32h-64zM320%2032h32v64h-32zm-64.65%2097.63l12.45-12.45l-44.62-44.63l-22.63%2022.63l33.17%2033.17h.6a172%20172%200%200%201%2021.03%201.28m148.853-12.46l44.626-44.625l22.627%2022.627l-44.625%2044.626z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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