water icon

water-48-filled from Fluent UI System Icons by Microsoft Corporation · 48 Filled · MIT Free for personal and commercial use.

Name
water-48-filled
Set
Fluent UI System Icons
Style
48 Filled
Viewbox
48×48
License
MIT

9 other variants in Fluent UI System Icons

water-16-filledwater-16-regularwater-20-filledwater-20-regularwater-24-filledwater-24-regularwater-32-filledwater-32-regularwater-48-regular

The same icon in other sets

waterAkar IconswaterBootstrap IconswaterBoxIcons v2waterFont Awesome 6 SolidwaterFont Awesome SolidwaterIconParkwaterIconPark OutlinewaterIconPark SolidwaterIconPark TwoTonewaterIonIconswaterLine AwesomewaterMaterial Line IconswaterMaterial SymbolswaterMaterial Symbols LightwaterMaterial Design Iconswater-boldSolarwaterUnicons

Use the water icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37 8a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 15.372 6.72 16 5.5 16a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.128a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036A1.5 1.5 0 0 1 37 8m0 12a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.631-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.402c-2.472 0-4.842-1.191-6.5-3.404c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 27.372 6.72 28 5.5 28a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.213 5.102-4.037A1.5 1.5 0 0 1 37 20m1.398 12.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 39.372 6.72 40 5.5 40a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0"/></svg>

React

import type { SVGProps } from "react";

export function FluentWater48Filled(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37 8a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 15.372 6.72 16 5.5 16a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.128a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036A1.5 1.5 0 0 1 37 8m0 12a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.631-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.402c-2.472 0-4.842-1.191-6.5-3.404c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 27.372 6.72 28 5.5 28a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.213 5.102-4.037A1.5 1.5 0 0 1 37 20m1.398 12.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 39.372 6.72 40 5.5 40a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><path fill="currentColor" d="M37 8a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 15.372 6.72 16 5.5 16a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.128a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036A1.5 1.5 0 0 1 37 8m0 12a1.5 1.5 0 0 1 1.398.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.631-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.402c-2.472 0-4.842-1.191-6.5-3.404c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 27.372 6.72 28 5.5 28a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.213 5.102-4.037A1.5 1.5 0 0 1 37 20m1.398 12.957c.55 1.413 1.39 2.452 2.22 3.127c.876.712 1.602.916 1.882.916a1.5 1.5 0 0 1 0 3c-1.22 0-2.597-.632-3.774-1.588a10 10 0 0 1-1.728-1.82c-1.658 2.211-4.026 3.401-6.498 3.401s-4.842-1.19-6.5-3.403c-1.658 2.213-4.027 3.404-6.5 3.404c-2.471 0-4.84-1.19-6.498-3.4a10 10 0 0 1-1.729 1.82C8.096 39.372 6.72 40 5.5 40a1.5 1.5 0 0 1 0-3c.281 0 1.007-.204 1.882-.914c.83-.674 1.67-1.712 2.22-3.127a1.5 1.5 0 0 1 2.796-.001c1.097 2.824 3.191 4.036 5.102 4.036c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0c1.097 2.824 3.191 4.036 5.102 4.035c1.91 0 4.005-1.212 5.102-4.036a1.5 1.5 0 0 1 2.796 0"/></svg>
</template>

CSS

.icon-water-48-filled {
  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%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M37%208a1.5%201.5%200%200%201%201.398.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.632-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.401s-4.842-1.19-6.5-3.403c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2015.372%206.72%2016%205.5%2016a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.128a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.035c1.91%200%204.005-1.212%205.102-4.036A1.5%201.5%200%200%201%2037%208m0%2012a1.5%201.5%200%200%201%201.398.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.631-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.402c-2.472%200-4.842-1.191-6.5-3.404c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2027.372%206.72%2028%205.5%2028a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.127a1.5%201.5%200%200%201%202.796-.001c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.213%205.102-4.037A1.5%201.5%200%200%201%2037%2020m1.398%2012.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.632-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.401s-4.842-1.19-6.5-3.403c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2039.372%206.72%2040%205.5%2040a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.127a1.5%201.5%200%200%201%202.796-.001c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.035c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200%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%2048%2048%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M37%208a1.5%201.5%200%200%201%201.398.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.632-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.401s-4.842-1.19-6.5-3.403c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2015.372%206.72%2016%205.5%2016a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.128a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.035c1.91%200%204.005-1.212%205.102-4.036A1.5%201.5%200%200%201%2037%208m0%2012a1.5%201.5%200%200%201%201.398.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.631-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.402c-2.472%200-4.842-1.191-6.5-3.404c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2027.372%206.72%2028%205.5%2028a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.127a1.5%201.5%200%200%201%202.796-.001c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.213%205.102-4.037A1.5%201.5%200%200%201%2037%2020m1.398%2012.957c.55%201.413%201.39%202.452%202.22%203.127c.876.712%201.602.916%201.882.916a1.5%201.5%200%200%201%200%203c-1.22%200-2.597-.632-3.774-1.588a10%2010%200%200%201-1.728-1.82c-1.658%202.211-4.026%203.401-6.498%203.401s-4.842-1.19-6.5-3.403c-1.658%202.213-4.027%203.404-6.5%203.404c-2.471%200-4.84-1.19-6.498-3.4a10%2010%200%200%201-1.729%201.82C8.096%2039.372%206.72%2040%205.5%2040a1.5%201.5%200%200%201%200-3c.281%200%201.007-.204%201.882-.914c.83-.674%201.67-1.712%202.22-3.127a1.5%201.5%200%200%201%202.796-.001c1.097%202.824%203.191%204.036%205.102%204.036c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200c1.097%202.824%203.191%204.036%205.102%204.035c1.91%200%204.005-1.212%205.102-4.036a1.5%201.5%200%200%201%202.796%200%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/water-48-filled.svg?color=%231a73e8&size=48