cloud rain icon
cloud-rain from Font Awesome Solid by Dave Gandy · Solid · Weather · CC-BY-4.0 Attribution required.
- Name
- cloud-rain
- Set
- Font Awesome Solid
- Style
- Solid
- Category
- Weather
- Viewbox
- 640×640
- License
- CC BY 4.0
The same icon in other sets
cloud-rainBootstrap Iconscloud-rainBoxIcons v2cloud-rainBoxIcons v2 Solidcloud-rainFramework7 Iconscloud-rainFont Awesome 6 Solidcloud-rainFeather Iconscloud-rainHuge Iconscloud-rainJam Iconscloud-rainLine Awesomecloud-rainLucidecloud-rainMyna UI Iconscloud-rainPhosphorcloud-rain-boldSolarcloud-rainTabler Iconscloud-rainUnicons
More weather icons from Font Awesome Solid
Use the cloud rain icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M160 384c-53 0-96-43-96-96c0-42.5 27.6-78.6 65.9-91.2c-1.3-6.7-1.9-13.7-1.9-20.8c0-61.9 50.1-112 112-112c43.1 0 80.5 24.3 99.2 60c14.7-17.1 36.5-28 60.8-28c44.2 0 80 35.8 80 80c0 5.5-.6 10.8-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96zm1.6 68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm152 0c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm121.8 68.2l30.2-68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16"/></svg>
React
import type { SVGProps } from "react";
export function Fa7SolidCloudRain(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="M160 384c-53 0-96-43-96-96c0-42.5 27.6-78.6 65.9-91.2c-1.3-6.7-1.9-13.7-1.9-20.8c0-61.9 50.1-112 112-112c43.1 0 80.5 24.3 99.2 60c14.7-17.1 36.5-28 60.8-28c44.2 0 80 35.8 80 80c0 5.5-.6 10.8-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96zm1.6 68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm152 0c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm121.8 68.2l30.2-68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M160 384c-53 0-96-43-96-96c0-42.5 27.6-78.6 65.9-91.2c-1.3-6.7-1.9-13.7-1.9-20.8c0-61.9 50.1-112 112-112c43.1 0 80.5 24.3 99.2 60c14.7-17.1 36.5-28 60.8-28c44.2 0 80 35.8 80 80c0 5.5-.6 10.8-1.6 16h1.6c53 0 96 43 96 96s-43 96-96 96zm1.6 68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm152 0c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16zm121.8 68.2l30.2-68.2c1.1-2.5 3.6-4.2 6.4-4.2s5.3 1.6 6.4 4.2l30.2 68.2c2.2 5.1 3.4 10.5 3.4 16c0 21.9-18.1 39.6-40 39.6s-40-17.7-40-39.6c0-5.5 1.2-11 3.4-16"/></svg> </template>
CSS
.icon-cloud-rain {
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%22M160%20384c-53%200-96-43-96-96c0-42.5%2027.6-78.6%2065.9-91.2c-1.3-6.7-1.9-13.7-1.9-20.8c0-61.9%2050.1-112%20112-112c43.1%200%2080.5%2024.3%2099.2%2060c14.7-17.1%2036.5-28%2060.8-28c44.2%200%2080%2035.8%2080%2080c0%205.5-.6%2010.8-1.6%2016h1.6c53%200%2096%2043%2096%2096s-43%2096-96%2096zm1.6%2068.2c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16zm152%200c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16zm121.8%2068.2l30.2-68.2c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16%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%22M160%20384c-53%200-96-43-96-96c0-42.5%2027.6-78.6%2065.9-91.2c-1.3-6.7-1.9-13.7-1.9-20.8c0-61.9%2050.1-112%20112-112c43.1%200%2080.5%2024.3%2099.2%2060c14.7-17.1%2036.5-28%2060.8-28c44.2%200%2080%2035.8%2080%2080c0%205.5-.6%2010.8-1.6%2016h1.6c53%200%2096%2043%2096%2096s-43%2096-96%2096zm1.6%2068.2c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16zm152%200c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16zm121.8%2068.2l30.2-68.2c1.1-2.5%203.6-4.2%206.4-4.2s5.3%201.6%206.4%204.2l30.2%2068.2c2.2%205.1%203.4%2010.5%203.4%2016c0%2021.9-18.1%2039.6-40%2039.6s-40-17.7-40-39.6c0-5.5%201.2-11%203.4-16%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/cloud-rain.svg?color=%231a73e8&size=48
