watch icon
watch from IconPark TwoTone by ByteDance · Two tone · Time · Apache-2.0 Free for personal and commercial use.
- Name
- watch
- Set
- IconPark TwoTone
- Style
- Two tone
- Category
- Time
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
watchBootstrap IconswatchBoxIcons v2 SolidwatchCarbonwatchCodiconswatchEmoji One (Colored)watchElement PluswatchFeather IconswatchFluent EmojiwatchFluent Emoji FlatwatchFluent Emoji High ContrastwatchFirefox OS EmojiwatchIconParkwatchIconPark OutlinewatchIconPark SolidwatchIonIconswatchJam IconswatchMaterial Line IconswatchLucidewatchMajesticonswatchMaterial SymbolswatchMaterial Symbols LightwatchMaterial Design Iconswatch-fillMingCute IconwatchMyna UI Icons
More time icons from IconPark TwoTone
Use the watch icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGcOaMObfg1"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path d="M34.956 31L31 44H17l-3.956-13m0-14L17 4h14l3.956 13"/><path fill="#555" d="M37 24c0 2.577-.75 4.98-2.044 7A12.99 12.99 0 0 1 24 37a12.99 12.99 0 0 1-10.956-6A12.94 12.94 0 0 1 11 24c0-2.577.75-4.98 2.044-7A12.99 12.99 0 0 1 24 11a12.99 12.99 0 0 1 10.956 6A12.94 12.94 0 0 1 37 24"/><path d="M24 17v7l4 4"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGcOaMObfg1)"/></svg>
React
import type { SVGProps } from "react";
export function IconParkTwotoneWatch(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGcOaMObfg1"><g fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4"><path d="M34.956 31L31 44H17l-3.956-13m0-14L17 4h14l3.956 13"/><path fill="#555" d="M37 24c0 2.577-.75 4.98-2.044 7A12.99 12.99 0 0 1 24 37a12.99 12.99 0 0 1-10.956-6A12.94 12.94 0 0 1 11 24c0-2.577.75-4.98 2.044-7A12.99 12.99 0 0 1 24 11a12.99 12.99 0 0 1 10.956 6A12.94 12.94 0 0 1 37 24"/><path d="M24 17v7l4 4"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGcOaMObfg1)"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGcOaMObfg1"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path d="M34.956 31L31 44H17l-3.956-13m0-14L17 4h14l3.956 13"/><path fill="#555" d="M37 24c0 2.577-.75 4.98-2.044 7A12.99 12.99 0 0 1 24 37a12.99 12.99 0 0 1-10.956-6A12.94 12.94 0 0 1 11 24c0-2.577.75-4.98 2.044-7A12.99 12.99 0 0 1 24 11a12.99 12.99 0 0 1 10.956 6A12.94 12.94 0 0 1 37 24"/><path d="M24 17v7l4 4"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGcOaMObfg1)"/></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%2048%2048%22%3E%3Cdefs%3E%3Cmask%20id%3D%22SVGcOaMObfg1%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M34.956%2031L31%2044H17l-3.956-13m0-14L17%204h14l3.956%2013%22%2F%3E%3Cpath%20fill%3D%22%23555%22%20d%3D%22M37%2024c0%202.577-.75%204.98-2.044%207A12.99%2012.99%200%200%201%2024%2037a12.99%2012.99%200%200%201-10.956-6A12.94%2012.94%200%200%201%2011%2024c0-2.577.75-4.98%202.044-7A12.99%2012.99%200%200%201%2024%2011a12.99%2012.99%200%200%201%2010.956%206A12.94%2012.94%200%200%201%2037%2024%22%2F%3E%3Cpath%20d%3D%22M24%2017v7l4%204%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVGcOaMObfg1)%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%2048%2048%22%3E%3Cdefs%3E%3Cmask%20id%3D%22SVGcOaMObfg1%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M34.956%2031L31%2044H17l-3.956-13m0-14L17%204h14l3.956%2013%22%2F%3E%3Cpath%20fill%3D%22%23555%22%20d%3D%22M37%2024c0%202.577-.75%204.98-2.044%207A12.99%2012.99%200%200%201%2024%2037a12.99%2012.99%200%200%201-10.956-6A12.94%2012.94%200%200%201%2011%2024c0-2.577.75-4.98%202.044-7A12.99%2012.99%200%200%201%2024%2011a12.99%2012.99%200%200%201%2010.956%206A12.94%2012.94%200%200%201%2037%2024%22%2F%3E%3Cpath%20d%3D%22M24%2017v7l4%204%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVGcOaMObfg1)%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-twotone/watch.svg?color=%231a73e8&size=48