hourglass icon
hourglass-outline from IonIcons by Ben Sperry · Outline · MIT Free for personal and commercial use.
- Name
- hourglass-outline
- Set
- IonIcons
- Style
- Outline
- Viewbox
- 512×512
- License
- MIT
2 other variants in IonIcons
The same icon in other sets
hourglass-filledAnt Design IconshourglassBootstrap IconshourglassBoxIcons v2hourglassBoxIcons v2 SolidhourglassCarbonhourglassFramework7 IconshourglassFont Awesome 6 RegularhourglassFont Awesome 6 SolidhourglassFont Awesome RegularhourglassFont Awesome Solidhourglass-outlineFlowbite Iconshourglass-12-filledFluent UI System IconshourglassFirefox OS EmojihourglassHuge IconshourglassIconParkhourglassIconPark OutlinehourglassIconoirhourglassJam IconshourglassLine AwesomehourglassLucidehourglassMaterial SymbolshourglassMaterial Symbols Lighthourglass-16OcticonshourglassPhosphor
Use the hourglass icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M145.61 464h220.78c19.8 0 35.55-16.29 33.42-35.06C386.06 308 304 310 304 256s83.11-51 95.8-172.94c2-18.78-13.61-35.06-33.41-35.06H145.61c-19.8 0-35.37 16.28-33.41 35.06C124.89 205 208 201 208 256s-82.06 52-95.8 172.94c-2.14 18.77 13.61 35.06 33.41 35.06"/><path fill="currentColor" d="M343.3 432H169.13c-15.6 0-20-18-9.06-29.16C186.55 376 240 356.78 240 326V224c0-19.85-38-35-61.51-67.2c-3.88-5.31-3.49-12.8 6.37-12.8h142.73c8.41 0 10.23 7.43 6.4 12.75C310.82 189 272 204.05 272 224v102c0 30.53 55.71 47 80.4 76.87c9.95 12.04 6.47 29.13-9.1 29.13"/></svg>
React
import type { SVGProps } from "react";
export function IonHourglassOutline(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="32" d="M145.61 464h220.78c19.8 0 35.55-16.29 33.42-35.06C386.06 308 304 310 304 256s83.11-51 95.8-172.94c2-18.78-13.61-35.06-33.41-35.06H145.61c-19.8 0-35.37 16.28-33.41 35.06C124.89 205 208 201 208 256s-82.06 52-95.8 172.94c-2.14 18.77 13.61 35.06 33.41 35.06"/><path fill="currentColor" d="M343.3 432H169.13c-15.6 0-20-18-9.06-29.16C186.55 376 240 356.78 240 326V224c0-19.85-38-35-61.51-67.2c-3.88-5.31-3.49-12.8 6.37-12.8h142.73c8.41 0 10.23 7.43 6.4 12.75C310.82 189 272 204.05 272 224v102c0 30.53 55.71 47 80.4 76.87c9.95 12.04 6.47 29.13-9.1 29.13"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M145.61 464h220.78c19.8 0 35.55-16.29 33.42-35.06C386.06 308 304 310 304 256s83.11-51 95.8-172.94c2-18.78-13.61-35.06-33.41-35.06H145.61c-19.8 0-35.37 16.28-33.41 35.06C124.89 205 208 201 208 256s-82.06 52-95.8 172.94c-2.14 18.77 13.61 35.06 33.41 35.06"/><path fill="currentColor" d="M343.3 432H169.13c-15.6 0-20-18-9.06-29.16C186.55 376 240 356.78 240 326V224c0-19.85-38-35-61.51-67.2c-3.88-5.31-3.49-12.8 6.37-12.8h142.73c8.41 0 10.23 7.43 6.4 12.75C310.82 189 272 204.05 272 224v102c0 30.53 55.71 47 80.4 76.87c9.95 12.04 6.47 29.13-9.1 29.13"/></svg> </template>
CSS
.icon-hourglass-outline {
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%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%2232%22%20d%3D%22M145.61%20464h220.78c19.8%200%2035.55-16.29%2033.42-35.06C386.06%20308%20304%20310%20304%20256s83.11-51%2095.8-172.94c2-18.78-13.61-35.06-33.41-35.06H145.61c-19.8%200-35.37%2016.28-33.41%2035.06C124.89%20205%20208%20201%20208%20256s-82.06%2052-95.8%20172.94c-2.14%2018.77%2013.61%2035.06%2033.41%2035.06%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M343.3%20432H169.13c-15.6%200-20-18-9.06-29.16C186.55%20376%20240%20356.78%20240%20326V224c0-19.85-38-35-61.51-67.2c-3.88-5.31-3.49-12.8%206.37-12.8h142.73c8.41%200%2010.23%207.43%206.4%2012.75C310.82%20189%20272%20204.05%20272%20224v102c0%2030.53%2055.71%2047%2080.4%2076.87c9.95%2012.04%206.47%2029.13-9.1%2029.13%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%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%2232%22%20d%3D%22M145.61%20464h220.78c19.8%200%2035.55-16.29%2033.42-35.06C386.06%20308%20304%20310%20304%20256s83.11-51%2095.8-172.94c2-18.78-13.61-35.06-33.41-35.06H145.61c-19.8%200-35.37%2016.28-33.41%2035.06C124.89%20205%20208%20201%20208%20256s-82.06%2052-95.8%20172.94c-2.14%2018.77%2013.61%2035.06%2033.41%2035.06%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M343.3%20432H169.13c-15.6%200-20-18-9.06-29.16C186.55%20376%20240%20356.78%20240%20326V224c0-19.85-38-35-61.51-67.2c-3.88-5.31-3.49-12.8%206.37-12.8h142.73c8.41%200%2010.23%207.43%206.4%2012.75C310.82%20189%20272%20204.05%20272%20224v102c0%2030.53%2055.71%2047%2080.4%2076.87c9.95%2012.04%206.47%2029.13-9.1%2029.13%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/hourglass-outline.svg?color=%231a73e8&size=48
