temperature icon
temperature-broken from Solar by 480 Design · Broken · Weather · CC-BY-4.0 Attribution required.
- Name
- temperature-broken
- Set
- Solar
- Style
- Broken
- Category
- Weather
- Viewbox
- 24×24
- License
- CC BY 4.0
5 other variants in Solar
The same icon in other sets
More weather icons from Solar
cloud-boldcloud-bolt-boldcloud-bolt-minimalistic-boldcloud-check-boldcloud-cross-boldcloud-download-boldcloud-minus-boldcloud-plus-boldcloud-rain-boldcloud-snowfall-boldcloud-snowfall-minimalistic-boldcloud-storm-boldcloud-sun-2-boldcloud-sun-boldcloud-upload-boldcloud-waterdrop-boldcloud-waterdrops-boldclouds-boldcloudy-moon-boldfog-boldmoon-boldmoon-fog-boldmoon-sleep-boldmoon-stars-bold
Use the temperature icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" d="M15 6V5C15 3.34315 13.6569 2 12 2C10.3431 2 9 3.34315 9 5V11.3477C9 11.6857 8.82505 11.9957 8.56141 12.2072C7.30465 13.2152 6.5 14.7636 6.5 16.5C6.5 19.5376 8.96243 22 12 22C15.0376 22 17.5 19.5376 17.5 16.5C17.5 14.7636 16.6954 13.2152 15.4386 12.2072C15.1749 11.9957 15 11.6857 15 11.3477V10"/><path d="M14.4998 16.5C14.4998 17.8807 13.3805 19 11.9998 19C10.619 19 9.49976 17.8807 9.49976 16.5C9.49976 15.1193 10.619 14 11.9998 14C13.3805 14 14.4998 15.1193 14.4998 16.5Z"/><path stroke-linecap="round" d="M12 14V12M12 5V8"/></g></svg>
React
import type { SVGProps } from "react";
export function SolarTemperatureBroken(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeWidth="1.5"><path strokeLinecap="round" d="M15 6V5C15 3.34315 13.6569 2 12 2C10.3431 2 9 3.34315 9 5V11.3477C9 11.6857 8.82505 11.9957 8.56141 12.2072C7.30465 13.2152 6.5 14.7636 6.5 16.5C6.5 19.5376 8.96243 22 12 22C15.0376 22 17.5 19.5376 17.5 16.5C17.5 14.7636 16.6954 13.2152 15.4386 12.2072C15.1749 11.9957 15 11.6857 15 11.3477V10"/><path d="M14.4998 16.5C14.4998 17.8807 13.3805 19 11.9998 19C10.619 19 9.49976 17.8807 9.49976 16.5C9.49976 15.1193 10.619 14 11.9998 14C13.3805 14 14.4998 15.1193 14.4998 16.5Z"/><path strokeLinecap="round" d="M12 14V12M12 5V8"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" d="M15 6V5C15 3.34315 13.6569 2 12 2C10.3431 2 9 3.34315 9 5V11.3477C9 11.6857 8.82505 11.9957 8.56141 12.2072C7.30465 13.2152 6.5 14.7636 6.5 16.5C6.5 19.5376 8.96243 22 12 22C15.0376 22 17.5 19.5376 17.5 16.5C17.5 14.7636 16.6954 13.2152 15.4386 12.2072C15.1749 11.9957 15 11.6857 15 11.3477V10"/><path d="M14.4998 16.5C14.4998 17.8807 13.3805 19 11.9998 19C10.619 19 9.49976 17.8807 9.49976 16.5C9.49976 15.1193 10.619 14 11.9998 14C13.3805 14 14.4998 15.1193 14.4998 16.5Z"/><path stroke-linecap="round" d="M12 14V12M12 5V8"/></g></svg> </template>
CSS
.icon-temperature-broken {
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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M15%206V5C15%203.34315%2013.6569%202%2012%202C10.3431%202%209%203.34315%209%205V11.3477C9%2011.6857%208.82505%2011.9957%208.56141%2012.2072C7.30465%2013.2152%206.5%2014.7636%206.5%2016.5C6.5%2019.5376%208.96243%2022%2012%2022C15.0376%2022%2017.5%2019.5376%2017.5%2016.5C17.5%2014.7636%2016.6954%2013.2152%2015.4386%2012.2072C15.1749%2011.9957%2015%2011.6857%2015%2011.3477V10%22%2F%3E%3Cpath%20d%3D%22M14.4998%2016.5C14.4998%2017.8807%2013.3805%2019%2011.9998%2019C10.619%2019%209.49976%2017.8807%209.49976%2016.5C9.49976%2015.1193%2010.619%2014%2011.9998%2014C13.3805%2014%2014.4998%2015.1193%2014.4998%2016.5Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M12%2014V12M12%205V8%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M15%206V5C15%203.34315%2013.6569%202%2012%202C10.3431%202%209%203.34315%209%205V11.3477C9%2011.6857%208.82505%2011.9957%208.56141%2012.2072C7.30465%2013.2152%206.5%2014.7636%206.5%2016.5C6.5%2019.5376%208.96243%2022%2012%2022C15.0376%2022%2017.5%2019.5376%2017.5%2016.5C17.5%2014.7636%2016.6954%2013.2152%2015.4386%2012.2072C15.1749%2011.9957%2015%2011.6857%2015%2011.3477V10%22%2F%3E%3Cpath%20d%3D%22M14.4998%2016.5C14.4998%2017.8807%2013.3805%2019%2011.9998%2019C10.619%2019%209.49976%2017.8807%209.49976%2016.5C9.49976%2015.1193%2010.619%2014%2011.9998%2014C13.3805%2014%2014.4998%2015.1193%2014.4998%2016.5Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M12%2014V12M12%205V8%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/solar/temperature-broken.svg?color=%231a73e8&size=48