hourglass icon

hourglass-sharp-fill from Keyline Icons by Keyline Icons · Sharp Fill · MIT Free for personal and commercial use.

Name
hourglass-sharp-fill
Set
Keyline Icons
Style
Sharp Fill
Viewbox
24×24
License
MIT

7 other variants in Keyline Icons

hourglasshourglass-duotonehourglass-fillhourglass-sharphourglass-sharp-duotonehourglass-sharp-two-tonehourglass-two-tone

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 OutlinehourglassIconoirhourglassIonIconshourglassJam IconshourglassLine AwesomehourglassLucidehourglassMaterial SymbolshourglassMaterial Symbols Lighthourglass-16Octicons

Use the hourglass icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 3L4 3L3 3L3 1L21 1L21 3L19 3L19 7C19 7.2968 18.8682 7.5782 18.6402 7.7682L13.562 12L18.6402 16.2318C18.8682 16.4218 19 16.7032 19 17L19 21L21 21L21 23L3 23L3 21L5 21L5 17C5 16.7032 5.1318 16.4218 5.3598 16.2318L10.438 12L5.3598 7.7682C5.1318 7.5782 5 7.2968 5 7ZM7 3L7 6.5316L12 10.6983L17 6.5316L17 3L7 3Z"/></svg>

React

import type { SVGProps } from "react";

export function KeylineIconsHourglassSharpFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 3L4 3L3 3L3 1L21 1L21 3L19 3L19 7C19 7.2968 18.8682 7.5782 18.6402 7.7682L13.562 12L18.6402 16.2318C18.8682 16.4218 19 16.7032 19 17L19 21L21 21L21 23L3 23L3 21L5 21L5 17C5 16.7032 5.1318 16.4218 5.3598 16.2318L10.438 12L5.3598 7.7682C5.1318 7.5782 5 7.2968 5 7ZM7 3L7 6.5316L12 10.6983L17 6.5316L17 3L7 3Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 3L4 3L3 3L3 1L21 1L21 3L19 3L19 7C19 7.2968 18.8682 7.5782 18.6402 7.7682L13.562 12L18.6402 16.2318C18.8682 16.4218 19 16.7032 19 17L19 21L21 21L21 23L3 23L3 21L5 21L5 17C5 16.7032 5.1318 16.4218 5.3598 16.2318L10.438 12L5.3598 7.7682C5.1318 7.5782 5 7.2968 5 7ZM7 3L7 6.5316L12 10.6983L17 6.5316L17 3L7 3Z"/></svg>
</template>

CSS

.icon-hourglass-sharp-fill {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5%203L4%203L3%203L3%201L21%201L21%203L19%203L19%207C19%207.2968%2018.8682%207.5782%2018.6402%207.7682L13.562%2012L18.6402%2016.2318C18.8682%2016.4218%2019%2016.7032%2019%2017L19%2021L21%2021L21%2023L3%2023L3%2021L5%2021L5%2017C5%2016.7032%205.1318%2016.4218%205.3598%2016.2318L10.438%2012L5.3598%207.7682C5.1318%207.5782%205%207.2968%205%207ZM7%203L7%206.5316L12%2010.6983L17%206.5316L17%203L7%203Z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5%203L4%203L3%203L3%201L21%201L21%203L19%203L19%207C19%207.2968%2018.8682%207.5782%2018.6402%207.7682L13.562%2012L18.6402%2016.2318C18.8682%2016.4218%2019%2016.7032%2019%2017L19%2021L21%2021L21%2023L3%2023L3%2021L5%2021L5%2017C5%2016.7032%205.1318%2016.4218%205.3598%2016.2318L10.438%2012L5.3598%207.7682C5.1318%207.5782%205%207.2968%205%207ZM7%203L7%206.5316L12%2010.6983L17%206.5316L17%203L7%203Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/hourglass-sharp-fill.svg?color=%231a73e8&size=48