temperature degree celsius icon
temperature-degree-celsius-20-filled from Fluent UI System Icons by Microsoft Corporation · 20 Filled · MIT Free for personal and commercial use.
- Name
- temperature-degree-celsius-20-filled
- Set
- Fluent UI System Icons
- Style
- 20 Filled
- Viewbox
- 20×20
- License
- MIT
11 other variants in Fluent UI System Icons
temperature-degree-celsius-16-filledtemperature-degree-celsius-16-regulartemperature-degree-celsius-20-regulartemperature-degree-celsius-24-filledtemperature-degree-celsius-24-regulartemperature-degree-celsius-28-filledtemperature-degree-celsius-28-regulartemperature-degree-celsius-32-filledtemperature-degree-celsius-32-regulartemperature-degree-celsius-48-filledtemperature-degree-celsius-48-regular
Related icons in Fluent UI System Icons
Use the temperature degree celsius icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M3 7a1.5 1.5 0 1 1 3 0a1.5 1.5 0 0 1-3 0m1.5-3a3 3 0 1 0 0 6a3 3 0 0 0 0-6m6.182 2.642C9.977 7.377 9.5 8.493 9.5 10s.477 2.623 1.182 3.358c.706.735 1.692 1.142 2.818 1.142s2.112-.407 2.818-1.142q.195-.204.365-.446c.17-.244.438-.412.735-.412c.561 0 .947.562.65 1.038q-.295.47-.668.859C16.387 15.45 14.998 16 13.5 16s-2.887-.549-3.9-1.603C8.587 13.34 8 11.832 8 10s.587-3.341 1.6-4.397C10.613 4.55 12.002 4 13.5 4s2.887.549 3.9 1.603q.374.39.668.86c.297.475-.089 1.037-.65 1.037c-.297 0-.564-.168-.735-.412a4 4 0 0 0-.365-.446C15.612 5.907 14.625 5.5 13.5 5.5s-2.112.407-2.818 1.142"/></svg>
React
import type { SVGProps } from "react";
export function FluentTemperatureDegreeCelsius20Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M3 7a1.5 1.5 0 1 1 3 0a1.5 1.5 0 0 1-3 0m1.5-3a3 3 0 1 0 0 6a3 3 0 0 0 0-6m6.182 2.642C9.977 7.377 9.5 8.493 9.5 10s.477 2.623 1.182 3.358c.706.735 1.692 1.142 2.818 1.142s2.112-.407 2.818-1.142q.195-.204.365-.446c.17-.244.438-.412.735-.412c.561 0 .947.562.65 1.038q-.295.47-.668.859C16.387 15.45 14.998 16 13.5 16s-2.887-.549-3.9-1.603C8.587 13.34 8 11.832 8 10s.587-3.341 1.6-4.397C10.613 4.55 12.002 4 13.5 4s2.887.549 3.9 1.603q.374.39.668.86c.297.475-.089 1.037-.65 1.037c-.297 0-.564-.168-.735-.412a4 4 0 0 0-.365-.446C15.612 5.907 14.625 5.5 13.5 5.5s-2.112.407-2.818 1.142"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M3 7a1.5 1.5 0 1 1 3 0a1.5 1.5 0 0 1-3 0m1.5-3a3 3 0 1 0 0 6a3 3 0 0 0 0-6m6.182 2.642C9.977 7.377 9.5 8.493 9.5 10s.477 2.623 1.182 3.358c.706.735 1.692 1.142 2.818 1.142s2.112-.407 2.818-1.142q.195-.204.365-.446c.17-.244.438-.412.735-.412c.561 0 .947.562.65 1.038q-.295.47-.668.859C16.387 15.45 14.998 16 13.5 16s-2.887-.549-3.9-1.603C8.587 13.34 8 11.832 8 10s.587-3.341 1.6-4.397C10.613 4.55 12.002 4 13.5 4s2.887.549 3.9 1.603q.374.39.668.86c.297.475-.089 1.037-.65 1.037c-.297 0-.564-.168-.735-.412a4 4 0 0 0-.365-.446C15.612 5.907 14.625 5.5 13.5 5.5s-2.112.407-2.818 1.142"/></svg> </template>
CSS
.icon-temperature-degree-celsius-20-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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M3%207a1.5%201.5%200%201%201%203%200a1.5%201.5%200%200%201-3%200m1.5-3a3%203%200%201%200%200%206a3%203%200%200%200%200-6m6.182%202.642C9.977%207.377%209.5%208.493%209.5%2010s.477%202.623%201.182%203.358c.706.735%201.692%201.142%202.818%201.142s2.112-.407%202.818-1.142q.195-.204.365-.446c.17-.244.438-.412.735-.412c.561%200%20.947.562.65%201.038q-.295.47-.668.859C16.387%2015.45%2014.998%2016%2013.5%2016s-2.887-.549-3.9-1.603C8.587%2013.34%208%2011.832%208%2010s.587-3.341%201.6-4.397C10.613%204.55%2012.002%204%2013.5%204s2.887.549%203.9%201.603q.374.39.668.86c.297.475-.089%201.037-.65%201.037c-.297%200-.564-.168-.735-.412a4%204%200%200%200-.365-.446C15.612%205.907%2014.625%205.5%2013.5%205.5s-2.112.407-2.818%201.142%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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M3%207a1.5%201.5%200%201%201%203%200a1.5%201.5%200%200%201-3%200m1.5-3a3%203%200%201%200%200%206a3%203%200%200%200%200-6m6.182%202.642C9.977%207.377%209.5%208.493%209.5%2010s.477%202.623%201.182%203.358c.706.735%201.692%201.142%202.818%201.142s2.112-.407%202.818-1.142q.195-.204.365-.446c.17-.244.438-.412.735-.412c.561%200%20.947.562.65%201.038q-.295.47-.668.859C16.387%2015.45%2014.998%2016%2013.5%2016s-2.887-.549-3.9-1.603C8.587%2013.34%208%2011.832%208%2010s.587-3.341%201.6-4.397C10.613%204.55%2012.002%204%2013.5%204s2.887.549%203.9%201.603q.374.39.668.86c.297.475-.089%201.037-.65%201.037c-.297%200-.564-.168-.735-.412a4%204%200%200%200-.365-.446C15.612%205.907%2014.625%205.5%2013.5%205.5s-2.112.407-2.818%201.142%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/temperature-degree-celsius-20-filled.svg?color=%231a73e8&size=48
