watch icon
watch from Octicons by GitHub · Regular · MIT Free for personal and commercial use.
- Name
- watch
- Set
- Octicons
- Style
- Regular
- Viewbox
- 12×16
- License
- MIT
The same icon in other sets
watchBootstrap IconswatchBoxIcons v2 SolidwatchCarbonwatchCodiconswatchEmoji One (Colored)watchElement PluswatchFeather IconswatchFluent EmojiwatchFluent Emoji FlatwatchFluent Emoji High ContrastwatchFirefox OS EmojiwatchIconParkwatchIconPark OutlinewatchIconPark SolidwatchIconPark TwoTonewatchIonIconswatchJam IconswatchMaterial Line IconswatchLucidewatchMajesticonswatchMaterial SymbolswatchMaterial Symbols LightwatchMaterial Design Iconswatch-fillMingCute Icon
Use the watch icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6 8h2v1H5V5h1v3zm6 0c0 2.22-1.2 4.16-3 5.19V15c0 .55-.45 1-1 1H4c-.55 0-1-.45-1-1v-1.81C1.2 12.16 0 10.22 0 8s1.2-4.16 3-5.19V1c0-.55.45-1 1-1h4c.55 0 1 .45 1 1v1.81c1.8 1.03 3 2.97 3 5.19zm-1 0c0-2.77-2.23-5-5-5S1 5.23 1 8s2.23 5 5 5s5-2.23 5-5z" fill="currentColor"/></svg>
React
import type { SVGProps } from "react";
export function OcticonWatch(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 16"><path fillRule="evenodd" d="M6 8h2v1H5V5h1v3zm6 0c0 2.22-1.2 4.16-3 5.19V15c0 .55-.45 1-1 1H4c-.55 0-1-.45-1-1v-1.81C1.2 12.16 0 10.22 0 8s1.2-4.16 3-5.19V1c0-.55.45-1 1-1h4c.55 0 1 .45 1 1v1.81c1.8 1.03 3 2.97 3 5.19zm-1 0c0-2.77-2.23-5-5-5S1 5.23 1 8s2.23 5 5 5s5-2.23 5-5z" fill="currentColor"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6 8h2v1H5V5h1v3zm6 0c0 2.22-1.2 4.16-3 5.19V15c0 .55-.45 1-1 1H4c-.55 0-1-.45-1-1v-1.81C1.2 12.16 0 10.22 0 8s1.2-4.16 3-5.19V1c0-.55.45-1 1-1h4c.55 0 1 .45 1 1v1.81c1.8 1.03 3 2.97 3 5.19zm-1 0c0-2.77-2.23-5-5-5S1 5.23 1 8s2.23 5 5 5s5-2.23 5-5z" fill="currentColor"/></svg> </template>
CSS
.icon-watch {
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%2012%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M6%208h2v1H5V5h1v3zm6%200c0%202.22-1.2%204.16-3%205.19V15c0%20.55-.45%201-1%201H4c-.55%200-1-.45-1-1v-1.81C1.2%2012.16%200%2010.22%200%208s1.2-4.16%203-5.19V1c0-.55.45-1%201-1h4c.55%200%201%20.45%201%201v1.81c1.8%201.03%203%202.97%203%205.19zm-1%200c0-2.77-2.23-5-5-5S1%205.23%201%208s2.23%205%205%205s5-2.23%205-5z%22%20fill%3D%22currentColor%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%2012%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M6%208h2v1H5V5h1v3zm6%200c0%202.22-1.2%204.16-3%205.19V15c0%20.55-.45%201-1%201H4c-.55%200-1-.45-1-1v-1.81C1.2%2012.16%200%2010.22%200%208s1.2-4.16%203-5.19V1c0-.55.45-1%201-1h4c.55%200%201%20.45%201%201v1.81c1.8%201.03%203%202.97%203%205.19zm-1%200c0-2.77-2.23-5-5-5S1%205.23%201%208s2.23%205%205%205s5-2.23%205-5z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/octicon/watch.svg?color=%231a73e8&size=48
