cloud sun icon
cloud-sun from Font Awesome Solid by Dave Gandy · Solid · Autumn · CC-BY-4.0 Attribution required.
- Name
- cloud-sun
- Set
- Font Awesome Solid
- Style
- Solid
- Category
- Autumn
- Viewbox
- 640×640
- License
- CC BY 4.0
The same icon in other sets
More autumn icons from Font Awesome Solid
Use the cloud sun icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M208.3 256c43.1 0 80.5 24.4 99.2 60.1c14.7-17.2 36.4-28.1 60.8-28.1c44.2 0 80 35.8 80 80c0 5.5-.6 10.9-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96h-320c-53 0-96-43-96-96c0-42.5 27.7-78.5 66-91.2c-1.3-6.8-2-13.7-2-20.8c0-61.9 50.1-112 112-112m192-223.8c5.3 0 10.3 2.7 13.3 7.1l47.3 70.4l83.3-16.3c5.2-1 10.6.7 14.3 4.4c3.8 3.8 5.4 9.2 4.4 14.4l-16.3 83.3l70.4 47.3c4.4 3 7.1 8 7.1 13.3s-2.6 10.3-7 13.2l-70.4 47.3l14.5 74.2c-17.2-21.7-40.4-38.4-67.2-47.3c-2.5-12.7-6.9-24.6-12.8-35.7c9.6-14.9 15.2-32.7 15.2-51.7c0-53-43-96-96-96c-47.9 0-87.6 35.1-94.8 80.9c-20.9-16-45.9-27-73.1-31.1l21.5-14.5l-16.3-83.2l-.3-2c-.3-4.6 1.3-9.1 4.6-12.4c3.8-3.8 9.2-5.4 14.4-4.4l83.3 16.3L387 39.3l1.2-1.6c3-3.5 7.4-5.5 12.1-5.5m0 175.8c26.5 0 48 21.5 48 48c0 3.8-.5 7.6-1.4 11.1c-21.7-16.9-48.9-27.1-78.6-27.1c-4.6 0-9.1.2-13.5.7c6.4-19 24.3-32.7 45.5-32.7"/></svg>
React
import type { SVGProps } from "react";
export function Fa7SolidCloudSun(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M208.3 256c43.1 0 80.5 24.4 99.2 60.1c14.7-17.2 36.4-28.1 60.8-28.1c44.2 0 80 35.8 80 80c0 5.5-.6 10.9-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96h-320c-53 0-96-43-96-96c0-42.5 27.7-78.5 66-91.2c-1.3-6.8-2-13.7-2-20.8c0-61.9 50.1-112 112-112m192-223.8c5.3 0 10.3 2.7 13.3 7.1l47.3 70.4l83.3-16.3c5.2-1 10.6.7 14.3 4.4c3.8 3.8 5.4 9.2 4.4 14.4l-16.3 83.3l70.4 47.3c4.4 3 7.1 8 7.1 13.3s-2.6 10.3-7 13.2l-70.4 47.3l14.5 74.2c-17.2-21.7-40.4-38.4-67.2-47.3c-2.5-12.7-6.9-24.6-12.8-35.7c9.6-14.9 15.2-32.7 15.2-51.7c0-53-43-96-96-96c-47.9 0-87.6 35.1-94.8 80.9c-20.9-16-45.9-27-73.1-31.1l21.5-14.5l-16.3-83.2l-.3-2c-.3-4.6 1.3-9.1 4.6-12.4c3.8-3.8 9.2-5.4 14.4-4.4l83.3 16.3L387 39.3l1.2-1.6c3-3.5 7.4-5.5 12.1-5.5m0 175.8c26.5 0 48 21.5 48 48c0 3.8-.5 7.6-1.4 11.1c-21.7-16.9-48.9-27.1-78.6-27.1c-4.6 0-9.1.2-13.5.7c6.4-19 24.3-32.7 45.5-32.7"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M208.3 256c43.1 0 80.5 24.4 99.2 60.1c14.7-17.2 36.4-28.1 60.8-28.1c44.2 0 80 35.8 80 80c0 5.5-.6 10.9-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96h-320c-53 0-96-43-96-96c0-42.5 27.7-78.5 66-91.2c-1.3-6.8-2-13.7-2-20.8c0-61.9 50.1-112 112-112m192-223.8c5.3 0 10.3 2.7 13.3 7.1l47.3 70.4l83.3-16.3c5.2-1 10.6.7 14.3 4.4c3.8 3.8 5.4 9.2 4.4 14.4l-16.3 83.3l70.4 47.3c4.4 3 7.1 8 7.1 13.3s-2.6 10.3-7 13.2l-70.4 47.3l14.5 74.2c-17.2-21.7-40.4-38.4-67.2-47.3c-2.5-12.7-6.9-24.6-12.8-35.7c9.6-14.9 15.2-32.7 15.2-51.7c0-53-43-96-96-96c-47.9 0-87.6 35.1-94.8 80.9c-20.9-16-45.9-27-73.1-31.1l21.5-14.5l-16.3-83.2l-.3-2c-.3-4.6 1.3-9.1 4.6-12.4c3.8-3.8 9.2-5.4 14.4-4.4l83.3 16.3L387 39.3l1.2-1.6c3-3.5 7.4-5.5 12.1-5.5m0 175.8c26.5 0 48 21.5 48 48c0 3.8-.5 7.6-1.4 11.1c-21.7-16.9-48.9-27.1-78.6-27.1c-4.6 0-9.1.2-13.5.7c6.4-19 24.3-32.7 45.5-32.7"/></svg> </template>
CSS
.icon-cloud-sun {
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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M208.3%20256c43.1%200%2080.5%2024.4%2099.2%2060.1c14.7-17.2%2036.4-28.1%2060.8-28.1c44.2%200%2080%2035.8%2080%2080c0%205.5-.6%2010.9-1.6%2016h1.6c53%200%2096%2043%2096%2096s-43%2096-96%2096h-320c-53%200-96-43-96-96c0-42.5%2027.7-78.5%2066-91.2c-1.3-6.8-2-13.7-2-20.8c0-61.9%2050.1-112%20112-112m192-223.8c5.3%200%2010.3%202.7%2013.3%207.1l47.3%2070.4l83.3-16.3c5.2-1%2010.6.7%2014.3%204.4c3.8%203.8%205.4%209.2%204.4%2014.4l-16.3%2083.3l70.4%2047.3c4.4%203%207.1%208%207.1%2013.3s-2.6%2010.3-7%2013.2l-70.4%2047.3l14.5%2074.2c-17.2-21.7-40.4-38.4-67.2-47.3c-2.5-12.7-6.9-24.6-12.8-35.7c9.6-14.9%2015.2-32.7%2015.2-51.7c0-53-43-96-96-96c-47.9%200-87.6%2035.1-94.8%2080.9c-20.9-16-45.9-27-73.1-31.1l21.5-14.5l-16.3-83.2l-.3-2c-.3-4.6%201.3-9.1%204.6-12.4c3.8-3.8%209.2-5.4%2014.4-4.4l83.3%2016.3L387%2039.3l1.2-1.6c3-3.5%207.4-5.5%2012.1-5.5m0%20175.8c26.5%200%2048%2021.5%2048%2048c0%203.8-.5%207.6-1.4%2011.1c-21.7-16.9-48.9-27.1-78.6-27.1c-4.6%200-9.1.2-13.5.7c6.4-19%2024.3-32.7%2045.5-32.7%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M208.3%20256c43.1%200%2080.5%2024.4%2099.2%2060.1c14.7-17.2%2036.4-28.1%2060.8-28.1c44.2%200%2080%2035.8%2080%2080c0%205.5-.6%2010.9-1.6%2016h1.6c53%200%2096%2043%2096%2096s-43%2096-96%2096h-320c-53%200-96-43-96-96c0-42.5%2027.7-78.5%2066-91.2c-1.3-6.8-2-13.7-2-20.8c0-61.9%2050.1-112%20112-112m192-223.8c5.3%200%2010.3%202.7%2013.3%207.1l47.3%2070.4l83.3-16.3c5.2-1%2010.6.7%2014.3%204.4c3.8%203.8%205.4%209.2%204.4%2014.4l-16.3%2083.3l70.4%2047.3c4.4%203%207.1%208%207.1%2013.3s-2.6%2010.3-7%2013.2l-70.4%2047.3l14.5%2074.2c-17.2-21.7-40.4-38.4-67.2-47.3c-2.5-12.7-6.9-24.6-12.8-35.7c9.6-14.9%2015.2-32.7%2015.2-51.7c0-53-43-96-96-96c-47.9%200-87.6%2035.1-94.8%2080.9c-20.9-16-45.9-27-73.1-31.1l21.5-14.5l-16.3-83.2l-.3-2c-.3-4.6%201.3-9.1%204.6-12.4c3.8-3.8%209.2-5.4%2014.4-4.4l83.3%2016.3L387%2039.3l1.2-1.6c3-3.5%207.4-5.5%2012.1-5.5m0%20175.8c26.5%200%2048%2021.5%2048%2048c0%203.8-.5%207.6-1.4%2011.1c-21.7-16.9-48.9-27.1-78.6-27.1c-4.6%200-9.1.2-13.5.7c6.4-19%2024.3-32.7%2045.5-32.7%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/cloud-sun.svg?color=%231a73e8&size=48
