watch icon
watch from BoxIcons v2 Solid by Boxicons · Solid · MIT Free for personal and commercial use.
- Name
- watch
- Set
- BoxIcons v2 Solid
- Style
- Solid
- Viewbox
- 24×24
- License
- MIT
The same icon in other sets
watchBootstrap IconswatchCarbonwatchCodiconswatchEmoji 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 IconwatchMyna UI Icons
Related icons in BoxIcons v2 Solid
Use the watch icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M13 8h-2v5h5v-2h-3z"/><path fill="currentColor" d="M19.999 12c0-2.953-1.612-5.53-3.999-6.916V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v2.083C5.613 6.469 4.001 9.047 4.001 12a8 8 0 0 0 4.136 7H8v2.041a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V19h-.139a8 8 0 0 0 4.138-7m-8 5.999A6.005 6.005 0 0 1 6.001 12a6.005 6.005 0 0 1 5.998-5.999c3.31 0 6 2.691 6 5.999a6.005 6.005 0 0 1-6 5.999"/></svg>
React
import type { SVGProps } from "react";
export function BxsWatch(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="M13 8h-2v5h5v-2h-3z"/><path fill="currentColor" d="M19.999 12c0-2.953-1.612-5.53-3.999-6.916V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v2.083C5.613 6.469 4.001 9.047 4.001 12a8 8 0 0 0 4.136 7H8v2.041a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V19h-.139a8 8 0 0 0 4.138-7m-8 5.999A6.005 6.005 0 0 1 6.001 12a6.005 6.005 0 0 1 5.998-5.999c3.31 0 6 2.691 6 5.999a6.005 6.005 0 0 1-6 5.999"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M13 8h-2v5h5v-2h-3z"/><path fill="currentColor" d="M19.999 12c0-2.953-1.612-5.53-3.999-6.916V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v2.083C5.613 6.469 4.001 9.047 4.001 12a8 8 0 0 0 4.136 7H8v2.041a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V19h-.139a8 8 0 0 0 4.138-7m-8 5.999A6.005 6.005 0 0 1 6.001 12a6.005 6.005 0 0 1 5.998-5.999c3.31 0 6 2.691 6 5.999a6.005 6.005 0 0 1-6 5.999"/></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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M13%208h-2v5h5v-2h-3z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M19.999%2012c0-2.953-1.612-5.53-3.999-6.916V3a1%201%200%200%200-1-1H9a1%201%200%200%200-1%201v2.083C5.613%206.469%204.001%209.047%204.001%2012a8%208%200%200%200%204.136%207H8v2.041a1%201%200%200%200%201%201h6a1%201%200%200%200%201-1V19h-.139a8%208%200%200%200%204.138-7m-8%205.999A6.005%206.005%200%200%201%206.001%2012a6.005%206.005%200%200%201%205.998-5.999c3.31%200%206%202.691%206%205.999a6.005%206.005%200%200%201-6%205.999%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%22M13%208h-2v5h5v-2h-3z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M19.999%2012c0-2.953-1.612-5.53-3.999-6.916V3a1%201%200%200%200-1-1H9a1%201%200%200%200-1%201v2.083C5.613%206.469%204.001%209.047%204.001%2012a8%208%200%200%200%204.136%207H8v2.041a1%201%200%200%200%201%201h6a1%201%200%200%200%201-1V19h-.139a8%208%200%200%200%204.138-7m-8%205.999A6.005%206.005%200%200%201%206.001%2012a6.005%206.005%200%200%201%205.998-5.999c3.31%200%206%202.691%206%205.999a6.005%206.005%200%200%201-6%205.999%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bxs/watch.svg?color=%231a73e8&size=48