temperature degree celsius icon

temperature-degree-celsius-16-filled from Fluent UI System Icons by Microsoft Corporation · 16 Filled · MIT Free for personal and commercial use.

Name
temperature-degree-celsius-16-filled
Set
Fluent UI System Icons
Style
16 Filled
Viewbox
16×16
License
MIT

11 other variants in Fluent UI System Icons

temperature-degree-celsius-16-regulartemperature-degree-celsius-20-filledtemperature-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

temperature-degree-fahrenheit-16-filled

Use the temperature degree celsius icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M2.5 5.5a1 1 0 1 1 2 0a1 1 0 0 1-2 0m1-2.5a2.5 2.5 0 1 0 0 5a2.5 2.5 0 0 0 0-5M11 4.5C9.401 4.5 8 5.76 8 8s1.401 3.5 3 3.5c.882 0 1.703-.382 2.263-1.101c.181-.233.446-.399.741-.399c.564 0 .954.565.644 1.036A4.3 4.3 0 0 1 11 13c-2.544 0-4.5-2.053-4.5-5S8.456 3 11 3c1.525 0 2.84.738 3.648 1.964c.31.471-.08 1.036-.644 1.036c-.295 0-.56-.166-.741-.399A2.83 2.83 0 0 0 11 4.5"/></svg>

React

import type { SVGProps } from "react";

export function FluentTemperatureDegreeCelsius16Filled(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M2.5 5.5a1 1 0 1 1 2 0a1 1 0 0 1-2 0m1-2.5a2.5 2.5 0 1 0 0 5a2.5 2.5 0 0 0 0-5M11 4.5C9.401 4.5 8 5.76 8 8s1.401 3.5 3 3.5c.882 0 1.703-.382 2.263-1.101c.181-.233.446-.399.741-.399c.564 0 .954.565.644 1.036A4.3 4.3 0 0 1 11 13c-2.544 0-4.5-2.053-4.5-5S8.456 3 11 3c1.525 0 2.84.738 3.648 1.964c.31.471-.08 1.036-.644 1.036c-.295 0-.56-.166-.741-.399A2.83 2.83 0 0 0 11 4.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M2.5 5.5a1 1 0 1 1 2 0a1 1 0 0 1-2 0m1-2.5a2.5 2.5 0 1 0 0 5a2.5 2.5 0 0 0 0-5M11 4.5C9.401 4.5 8 5.76 8 8s1.401 3.5 3 3.5c.882 0 1.703-.382 2.263-1.101c.181-.233.446-.399.741-.399c.564 0 .954.565.644 1.036A4.3 4.3 0 0 1 11 13c-2.544 0-4.5-2.053-4.5-5S8.456 3 11 3c1.525 0 2.84.738 3.648 1.964c.31.471-.08 1.036-.644 1.036c-.295 0-.56-.166-.741-.399A2.83 2.83 0 0 0 11 4.5"/></svg>
</template>

CSS

.icon-temperature-degree-celsius-16-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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.5%205.5a1%201%200%201%201%202%200a1%201%200%200%201-2%200m1-2.5a2.5%202.5%200%201%200%200%205a2.5%202.5%200%200%200%200-5M11%204.5C9.401%204.5%208%205.76%208%208s1.401%203.5%203%203.5c.882%200%201.703-.382%202.263-1.101c.181-.233.446-.399.741-.399c.564%200%20.954.565.644%201.036A4.3%204.3%200%200%201%2011%2013c-2.544%200-4.5-2.053-4.5-5S8.456%203%2011%203c1.525%200%202.84.738%203.648%201.964c.31.471-.08%201.036-.644%201.036c-.295%200-.56-.166-.741-.399A2.83%202.83%200%200%200%2011%204.5%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.5%205.5a1%201%200%201%201%202%200a1%201%200%200%201-2%200m1-2.5a2.5%202.5%200%201%200%200%205a2.5%202.5%200%200%200%200-5M11%204.5C9.401%204.5%208%205.76%208%208s1.401%203.5%203%203.5c.882%200%201.703-.382%202.263-1.101c.181-.233.446-.399.741-.399c.564%200%20.954.565.644%201.036A4.3%204.3%200%200%201%2011%2013c-2.544%200-4.5-2.053-4.5-5S8.456%203%2011%203c1.525%200%202.84.738%203.648%201.964c.31.471-.08%201.036-.644%201.036c-.295%200-.56-.166-.741-.399A2.83%202.83%200%200%200%2011%204.5%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-16-filled.svg?color=%231a73e8&size=48