thermometer icon
thermometer from Material Symbols Light by Google · Regular · Household · Apache-2.0 Free for personal and commercial use.
- Name
- thermometer
- Set
- Material Symbols Light
- Style
- Regular
- Category
- Household
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- thermometer-rounded, thermometer-sharp
1 other variant in Material Symbols Light
The same icon in other sets
thermometerBootstrap IconsthermometerBoxIcons v2 SolidthermometerEmoji One (Colored)thermometer-fillEva IconsthermometerFramework7 IconsthermometerFont Awesome 6 SolidthermometerFont Awesome SolidthermometerFeather IconsthermometerFluent EmojithermometerFluent Emoji FlatthermometerFluent Emoji High ContrastthermometerFirefox OS Emojithermometercss.ggthermometerHealth IconsthermometerHuge IconsthermometerIconParkthermometerIconPark OutlinethermometerIconPark SolidthermometerIconPark TwoTonethermometerIonIconsthermometerLine AwesomethermometerLucidethermometerMaterial SymbolsthermometerMaterial Design Icons
More household icons from Material Symbols Light
Use the thermometer icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 20q-1.671 0-2.835-1.164Q8 17.67 8 16q0-1.084.544-1.987T10 12.539V6q0-.846.577-1.423T12 4t1.423.577T14 6v6.539q.912.57 1.446 1.474q.535.903.554 1.987q-.02 1.671-1.184 2.836T12 20m-1-10h2V6q0-.425-.288-.712T12 5t-.712.288T11 6z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLightThermometer(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 20q-1.671 0-2.835-1.164Q8 17.67 8 16q0-1.084.544-1.987T10 12.539V6q0-.846.577-1.423T12 4t1.423.577T14 6v6.539q.912.57 1.446 1.474q.535.903.554 1.987q-.02 1.671-1.184 2.836T12 20m-1-10h2V6q0-.425-.288-.712T12 5t-.712.288T11 6z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 20q-1.671 0-2.835-1.164Q8 17.67 8 16q0-1.084.544-1.987T10 12.539V6q0-.846.577-1.423T12 4t1.423.577T14 6v6.539q.912.57 1.446 1.474q.535.903.554 1.987q-.02 1.671-1.184 2.836T12 20m-1-10h2V6q0-.425-.288-.712T12 5t-.712.288T11 6z"/></svg> </template>
CSS
.icon-thermometer {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%2020q-1.671%200-2.835-1.164Q8%2017.67%208%2016q0-1.084.544-1.987T10%2012.539V6q0-.846.577-1.423T12%204t1.423.577T14%206v6.539q.912.57%201.446%201.474q.535.903.554%201.987q-.02%201.671-1.184%202.836T12%2020m-1-10h2V6q0-.425-.288-.712T12%205t-.712.288T11%206z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%2020q-1.671%200-2.835-1.164Q8%2017.67%208%2016q0-1.084.544-1.987T10%2012.539V6q0-.846.577-1.423T12%204t1.423.577T14%206v6.539q.912.57%201.446%201.474q.535.903.554%201.987q-.02%201.671-1.184%202.836T12%2020m-1-10h2V6q0-.425-.288-.712T12%205t-.712.288T11%206z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/thermometer.svg?color=%231a73e8&size=48
