hourglass three quarter icon

hourglass-three-quarter-20-regular from Fluent UI System Icons by Microsoft Corporation · 20 Regular · MIT Free for personal and commercial use.

Name: hourglass-three-quarter-20-regular
Set: Fluent UI System Icons
Style: 20 Regular
Viewbox: 20×20
License: MIT

7 other variants in Fluent UI System Icons

hourglass-three-quarter-12-filled hourglass-three-quarter-12-regular hourglass-three-quarter-16-filled hourglass-three-quarter-16-regular hourglass-three-quarter-20-filled hourglass-three-quarter-24-filled hourglass-three-quarter-24-regular

Related icons in Fluent UI System Icons

hourglass-half-12-filled hourglass-one-quarter-12-filled

Use the hourglass three quarter icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M13.842 5H6.163q.066.204.157.4c.208.45.515.847.9 1.16l1.82 1.52c.28.234.506.528.66.86c.16.33.241.693.24 1.06c.001.367-.08.73-.24 1.06a2.5 2.5 0 0 1-.66.86l-1.82 1.52a3.25 3.25 0 0 0-.9 1.16A3.4 3.4 0 0 0 6 16h8a3.5 3.5 0 0 0-.31-1.4a3.4 3.4 0 0 0-.91-1.16L11 11.91a2.45 2.45 0 0 1-.65-.85a2.4 2.4 0 0 1-.29-1.06a2.4 2.4 0 0 1 .29-1.06a2.45 2.45 0 0 1 .65-.85l1.78-1.53a3.4 3.4 0 0 0 .91-1.16q.089-.195.152-.4M5.195 17.844q.345.156.727.156h8.156q.39-.008.735-.156q.343-.15.609-.422q.266-.273.422-.617q.156-.345.156-.727q0-.617-.133-1.195a6 6 0 0 0-.375-1.117a5 5 0 0 0-.601-1.008a5.4 5.4 0 0 0-.828-.86l-1.82-1.515a.497.497 0 0 1 0-.766l1.82-1.523a5.3 5.3 0 0 0 1.445-1.867A5.45 5.45 0 0 0 16 3.922a1.88 1.88 0 0 0-.578-1.344a2.2 2.2 0 0 0-.617-.422A1.7 1.7 0 0 0 14.078 2H5.922q-.39.007-.734.156q-.345.15-.61.422a2.2 2.2 0 0 0-.422.617Q4 3.54 4 3.922q.008 1.234.5 2.305a5.35 5.35 0 0 0 1.438 1.867l1.82 1.523a.498.498 0 0 1 0 .766l-1.82 1.515a5.7 5.7 0 0 0-.829.868a5.35 5.35 0 0 0-.984 2.125A5.6 5.6 0 0 0 4 16.078q.008.39.156.735q.15.343.422.609q.273.266.617.422m9.211-.914a1 1 0 0 1-.367.07H5.961a1 1 0 0 1-.375-.078a1 1 0 0 1-.305-.203a.9.9 0 0 1-.21-.305A1 1 0 0 1 5 16.04a4.45 4.45 0 0 1 .414-1.86a4.3 4.3 0 0 1 1.164-1.507l1.82-1.524q.258-.218.399-.515a1.51 1.51 0 0 0 0-1.273a1.4 1.4 0 0 0-.399-.516l-1.82-1.516a4 4 0 0 1-.672-.695a5 5 0 0 1-.492-.813a4 4 0 0 1-.312-.906A4.5 4.5 0 0 1 5 3.961q.008-.21.078-.375q.07-.164.203-.305a.9.9 0 0 1 .305-.21A1 1 0 0 1 5.96 3h8.078q.21.015.375.078t.305.203a.95.95 0 0 1 .281.68a4.4 4.4 0 0 1-.414 1.867a4.3 4.3 0 0 1-1.164 1.5l-1.82 1.516q-.258.21-.399.515a1.51 1.51 0 0 0 0 1.274q.141.297.399.515l1.82 1.524q.765.64 1.172 1.508q.406.867.406 1.86a1.3 1.3 0 0 1-.078.374a.9.9 0 0 1-.203.305a1 1 0 0 1-.313.21"/></svg>

React

import type { SVGProps } from "react";

export function FluentHourglassThreeQuarter20Regular(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="M13.842 5H6.163q.066.204.157.4c.208.45.515.847.9 1.16l1.82 1.52c.28.234.506.528.66.86c.16.33.241.693.24 1.06c.001.367-.08.73-.24 1.06a2.5 2.5 0 0 1-.66.86l-1.82 1.52a3.25 3.25 0 0 0-.9 1.16A3.4 3.4 0 0 0 6 16h8a3.5 3.5 0 0 0-.31-1.4a3.4 3.4 0 0 0-.91-1.16L11 11.91a2.45 2.45 0 0 1-.65-.85a2.4 2.4 0 0 1-.29-1.06a2.4 2.4 0 0 1 .29-1.06a2.45 2.45 0 0 1 .65-.85l1.78-1.53a3.4 3.4 0 0 0 .91-1.16q.089-.195.152-.4M5.195 17.844q.345.156.727.156h8.156q.39-.008.735-.156q.343-.15.609-.422q.266-.273.422-.617q.156-.345.156-.727q0-.617-.133-1.195a6 6 0 0 0-.375-1.117a5 5 0 0 0-.601-1.008a5.4 5.4 0 0 0-.828-.86l-1.82-1.515a.497.497 0 0 1 0-.766l1.82-1.523a5.3 5.3 0 0 0 1.445-1.867A5.45 5.45 0 0 0 16 3.922a1.88 1.88 0 0 0-.578-1.344a2.2 2.2 0 0 0-.617-.422A1.7 1.7 0 0 0 14.078 2H5.922q-.39.007-.734.156q-.345.15-.61.422a2.2 2.2 0 0 0-.422.617Q4 3.54 4 3.922q.008 1.234.5 2.305a5.35 5.35 0 0 0 1.438 1.867l1.82 1.523a.498.498 0 0 1 0 .766l-1.82 1.515a5.7 5.7 0 0 0-.829.868a5.35 5.35 0 0 0-.984 2.125A5.6 5.6 0 0 0 4 16.078q.008.39.156.735q.15.343.422.609q.273.266.617.422m9.211-.914a1 1 0 0 1-.367.07H5.961a1 1 0 0 1-.375-.078a1 1 0 0 1-.305-.203a.9.9 0 0 1-.21-.305A1 1 0 0 1 5 16.04a4.45 4.45 0 0 1 .414-1.86a4.3 4.3 0 0 1 1.164-1.507l1.82-1.524q.258-.218.399-.515a1.51 1.51 0 0 0 0-1.273a1.4 1.4 0 0 0-.399-.516l-1.82-1.516a4 4 0 0 1-.672-.695a5 5 0 0 1-.492-.813a4 4 0 0 1-.312-.906A4.5 4.5 0 0 1 5 3.961q.008-.21.078-.375q.07-.164.203-.305a.9.9 0 0 1 .305-.21A1 1 0 0 1 5.96 3h8.078q.21.015.375.078t.305.203a.95.95 0 0 1 .281.68a4.4 4.4 0 0 1-.414 1.867a4.3 4.3 0 0 1-1.164 1.5l-1.82 1.516q-.258.21-.399.515a1.51 1.51 0 0 0 0 1.274q.141.297.399.515l1.82 1.524q.765.64 1.172 1.508q.406.867.406 1.86a1.3 1.3 0 0 1-.078.374a.9.9 0 0 1-.203.305a1 1 0 0 1-.313.21"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M13.842 5H6.163q.066.204.157.4c.208.45.515.847.9 1.16l1.82 1.52c.28.234.506.528.66.86c.16.33.241.693.24 1.06c.001.367-.08.73-.24 1.06a2.5 2.5 0 0 1-.66.86l-1.82 1.52a3.25 3.25 0 0 0-.9 1.16A3.4 3.4 0 0 0 6 16h8a3.5 3.5 0 0 0-.31-1.4a3.4 3.4 0 0 0-.91-1.16L11 11.91a2.45 2.45 0 0 1-.65-.85a2.4 2.4 0 0 1-.29-1.06a2.4 2.4 0 0 1 .29-1.06a2.45 2.45 0 0 1 .65-.85l1.78-1.53a3.4 3.4 0 0 0 .91-1.16q.089-.195.152-.4M5.195 17.844q.345.156.727.156h8.156q.39-.008.735-.156q.343-.15.609-.422q.266-.273.422-.617q.156-.345.156-.727q0-.617-.133-1.195a6 6 0 0 0-.375-1.117a5 5 0 0 0-.601-1.008a5.4 5.4 0 0 0-.828-.86l-1.82-1.515a.497.497 0 0 1 0-.766l1.82-1.523a5.3 5.3 0 0 0 1.445-1.867A5.45 5.45 0 0 0 16 3.922a1.88 1.88 0 0 0-.578-1.344a2.2 2.2 0 0 0-.617-.422A1.7 1.7 0 0 0 14.078 2H5.922q-.39.007-.734.156q-.345.15-.61.422a2.2 2.2 0 0 0-.422.617Q4 3.54 4 3.922q.008 1.234.5 2.305a5.35 5.35 0 0 0 1.438 1.867l1.82 1.523a.498.498 0 0 1 0 .766l-1.82 1.515a5.7 5.7 0 0 0-.829.868a5.35 5.35 0 0 0-.984 2.125A5.6 5.6 0 0 0 4 16.078q.008.39.156.735q.15.343.422.609q.273.266.617.422m9.211-.914a1 1 0 0 1-.367.07H5.961a1 1 0 0 1-.375-.078a1 1 0 0 1-.305-.203a.9.9 0 0 1-.21-.305A1 1 0 0 1 5 16.04a4.45 4.45 0 0 1 .414-1.86a4.3 4.3 0 0 1 1.164-1.507l1.82-1.524q.258-.218.399-.515a1.51 1.51 0 0 0 0-1.273a1.4 1.4 0 0 0-.399-.516l-1.82-1.516a4 4 0 0 1-.672-.695a5 5 0 0 1-.492-.813a4 4 0 0 1-.312-.906A4.5 4.5 0 0 1 5 3.961q.008-.21.078-.375q.07-.164.203-.305a.9.9 0 0 1 .305-.21A1 1 0 0 1 5.96 3h8.078q.21.015.375.078t.305.203a.95.95 0 0 1 .281.68a4.4 4.4 0 0 1-.414 1.867a4.3 4.3 0 0 1-1.164 1.5l-1.82 1.516q-.258.21-.399.515a1.51 1.51 0 0 0 0 1.274q.141.297.399.515l1.82 1.524q.765.64 1.172 1.508q.406.867.406 1.86a1.3 1.3 0 0 1-.078.374a.9.9 0 0 1-.203.305a1 1 0 0 1-.313.21"/></svg>
</template>

CSS

.icon-hourglass-three-quarter-20-regular {
  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%22M13.842%205H6.163q.066.204.157.4c.208.45.515.847.9%201.16l1.82%201.52c.28.234.506.528.66.86c.16.33.241.693.24%201.06c.001.367-.08.73-.24%201.06a2.5%202.5%200%200%201-.66.86l-1.82%201.52a3.25%203.25%200%200%200-.9%201.16A3.4%203.4%200%200%200%206%2016h8a3.5%203.5%200%200%200-.31-1.4a3.4%203.4%200%200%200-.91-1.16L11%2011.91a2.45%202.45%200%200%201-.65-.85a2.4%202.4%200%200%201-.29-1.06a2.4%202.4%200%200%201%20.29-1.06a2.45%202.45%200%200%201%20.65-.85l1.78-1.53a3.4%203.4%200%200%200%20.91-1.16q.089-.195.152-.4M5.195%2017.844q.345.156.727.156h8.156q.39-.008.735-.156q.343-.15.609-.422q.266-.273.422-.617q.156-.345.156-.727q0-.617-.133-1.195a6%206%200%200%200-.375-1.117a5%205%200%200%200-.601-1.008a5.4%205.4%200%200%200-.828-.86l-1.82-1.515a.497.497%200%200%201%200-.766l1.82-1.523a5.3%205.3%200%200%200%201.445-1.867A5.45%205.45%200%200%200%2016%203.922a1.88%201.88%200%200%200-.578-1.344a2.2%202.2%200%200%200-.617-.422A1.7%201.7%200%200%200%2014.078%202H5.922q-.39.007-.734.156q-.345.15-.61.422a2.2%202.2%200%200%200-.422.617Q4%203.54%204%203.922q.008%201.234.5%202.305a5.35%205.35%200%200%200%201.438%201.867l1.82%201.523a.498.498%200%200%201%200%20.766l-1.82%201.515a5.7%205.7%200%200%200-.829.868a5.35%205.35%200%200%200-.984%202.125A5.6%205.6%200%200%200%204%2016.078q.008.39.156.735q.15.343.422.609q.273.266.617.422m9.211-.914a1%201%200%200%201-.367.07H5.961a1%201%200%200%201-.375-.078a1%201%200%200%201-.305-.203a.9.9%200%200%201-.21-.305A1%201%200%200%201%205%2016.04a4.45%204.45%200%200%201%20.414-1.86a4.3%204.3%200%200%201%201.164-1.507l1.82-1.524q.258-.218.399-.515a1.51%201.51%200%200%200%200-1.273a1.4%201.4%200%200%200-.399-.516l-1.82-1.516a4%204%200%200%201-.672-.695a5%205%200%200%201-.492-.813a4%204%200%200%201-.312-.906A4.5%204.5%200%200%201%205%203.961q.008-.21.078-.375q.07-.164.203-.305a.9.9%200%200%201%20.305-.21A1%201%200%200%201%205.96%203h8.078q.21.015.375.078t.305.203a.95.95%200%200%201%20.281.68a4.4%204.4%200%200%201-.414%201.867a4.3%204.3%200%200%201-1.164%201.5l-1.82%201.516q-.258.21-.399.515a1.51%201.51%200%200%200%200%201.274q.141.297.399.515l1.82%201.524q.765.64%201.172%201.508q.406.867.406%201.86a1.3%201.3%200%200%201-.078.374a.9.9%200%200%201-.203.305a1%201%200%200%201-.313.21%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%22M13.842%205H6.163q.066.204.157.4c.208.45.515.847.9%201.16l1.82%201.52c.28.234.506.528.66.86c.16.33.241.693.24%201.06c.001.367-.08.73-.24%201.06a2.5%202.5%200%200%201-.66.86l-1.82%201.52a3.25%203.25%200%200%200-.9%201.16A3.4%203.4%200%200%200%206%2016h8a3.5%203.5%200%200%200-.31-1.4a3.4%203.4%200%200%200-.91-1.16L11%2011.91a2.45%202.45%200%200%201-.65-.85a2.4%202.4%200%200%201-.29-1.06a2.4%202.4%200%200%201%20.29-1.06a2.45%202.45%200%200%201%20.65-.85l1.78-1.53a3.4%203.4%200%200%200%20.91-1.16q.089-.195.152-.4M5.195%2017.844q.345.156.727.156h8.156q.39-.008.735-.156q.343-.15.609-.422q.266-.273.422-.617q.156-.345.156-.727q0-.617-.133-1.195a6%206%200%200%200-.375-1.117a5%205%200%200%200-.601-1.008a5.4%205.4%200%200%200-.828-.86l-1.82-1.515a.497.497%200%200%201%200-.766l1.82-1.523a5.3%205.3%200%200%200%201.445-1.867A5.45%205.45%200%200%200%2016%203.922a1.88%201.88%200%200%200-.578-1.344a2.2%202.2%200%200%200-.617-.422A1.7%201.7%200%200%200%2014.078%202H5.922q-.39.007-.734.156q-.345.15-.61.422a2.2%202.2%200%200%200-.422.617Q4%203.54%204%203.922q.008%201.234.5%202.305a5.35%205.35%200%200%200%201.438%201.867l1.82%201.523a.498.498%200%200%201%200%20.766l-1.82%201.515a5.7%205.7%200%200%200-.829.868a5.35%205.35%200%200%200-.984%202.125A5.6%205.6%200%200%200%204%2016.078q.008.39.156.735q.15.343.422.609q.273.266.617.422m9.211-.914a1%201%200%200%201-.367.07H5.961a1%201%200%200%201-.375-.078a1%201%200%200%201-.305-.203a.9.9%200%200%201-.21-.305A1%201%200%200%201%205%2016.04a4.45%204.45%200%200%201%20.414-1.86a4.3%204.3%200%200%201%201.164-1.507l1.82-1.524q.258-.218.399-.515a1.51%201.51%200%200%200%200-1.273a1.4%201.4%200%200%200-.399-.516l-1.82-1.516a4%204%200%200%201-.672-.695a5%205%200%200%201-.492-.813a4%204%200%200%201-.312-.906A4.5%204.5%200%200%201%205%203.961q.008-.21.078-.375q.07-.164.203-.305a.9.9%200%200%201%20.305-.21A1%201%200%200%201%205.96%203h8.078q.21.015.375.078t.305.203a.95.95%200%200%201%20.281.68a4.4%204.4%200%200%201-.414%201.867a4.3%204.3%200%200%201-1.164%201.5l-1.82%201.516q-.258.21-.399.515a1.51%201.51%200%200%200%200%201.274q.141.297.399.515l1.82%201.524q.765.64%201.172%201.508q.406.867.406%201.86a1.3%201.3%200%200%201-.078.374a.9.9%200%200%201-.203.305a1%201%200%200%201-.313.21%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/hourglass-three-quarter-20-regular.svg?color=%231a73e8&size=48