Menu

Beta
Sign in
Temperature SVG icon, line

Temperature SVG icon, line

A vertical thermometer with a bulb, mercury line, and side ticks represents outdoor temperature. It fits a station readings panel and a mobile weather app.

Free · from Home Weather Station Icons, Line

Similar SVGs

More from Home Weather Station Icons, Line

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/mbcrnJir0r-t/amnt.svg" alt="Temperature" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><g id="layer-1" data-name="Shape 1"><path d="M8 15.3L8 5C8 3.9 8.9 3 10 3C11.1 3 12 3.9 12 5L12 15.3C13.25 16.17 13.8 17.76 13.34 19.22C12.88 20.68 11.53 21.67 10 21.67C8.47 21.67 7.12 20.68 6.66 19.22C6.2 17.76 6.75 16.17 8 15.3Z" fill="none" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-2" data-name="Shape 2"><path d="M10 11L10 18" fill="none" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-3" data-name="Circle 3"><path d="M11.2 18C11.2 18.66 10.66 19.2 10 19.2C9.34 19.2 8.8 18.66 8.8 18C8.8 17.34 9.34 16.8 10 16.8C10.66 16.8 11.2 17.34 11.2 18Z" fill="none" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-4" data-name="Shape 4"><path d="M15 6L17 6M15 9L17 9M15 12L17 12" fill="none" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
CSS background-image
.temperature {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/mbcrnJir0r-t/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.temperature {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/mbcrnJir0r-t/amnt.svg") center / contain no-repeat;
}
React
import TemperatureSvg from "./temperature.jsx"; // from the React tab above

<TemperatureSvg width={48} height={48} />

Tags

temperaturethermometerweathermeasurement

Made with AMNT

AMNT SVG 1.1 drew this from the words Draw one outdoor temperature weather icon: a vertical thermometer with a circular bulb, a short inner mercury line, and three short tick marks along its right side. Use a clean monochrome outline, uniform stroke width, rounded caps and joins, no numbers or text, and a transparent square canvas. Keep details readable at 24 pixels. as part of the pack Home Weather Station Icons, Line. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings