watch icon
watch-filled from TDesign Icons by TDesign · Filled · MIT Free for personal and commercial use.
- Name
- watch-filled
- Set
- TDesign Icons
- Style
- Filled
- Viewbox
- 24×24
- License
- MIT
1 other variant in TDesign Icons
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 24 24"><path fill="currentColor" d="M7.117 0h9.766l.503 4.025A3 3 0 0 1 20 7v2h1v6h-1v2a3 3 0 0 1-2.614 2.975L16.883 24H7.117l-.503-4.025A3 3 0 0 1 4 17V7a3 3 0 0 1 2.614-2.975zM7 18h10a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1"/></svg>
React
import type { SVGProps } from "react";
export function TdesignWatchFilled(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="M7.117 0h9.766l.503 4.025A3 3 0 0 1 20 7v2h1v6h-1v2a3 3 0 0 1-2.614 2.975L16.883 24H7.117l-.503-4.025A3 3 0 0 1 4 17V7a3 3 0 0 1 2.614-2.975zM7 18h10a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.117 0h9.766l.503 4.025A3 3 0 0 1 20 7v2h1v6h-1v2a3 3 0 0 1-2.614 2.975L16.883 24H7.117l-.503-4.025A3 3 0 0 1 4 17V7a3 3 0 0 1 2.614-2.975zM7 18h10a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1"/></svg> </template>
CSS
.icon-watch-filled {
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%22M7.117%200h9.766l.503%204.025A3%203%200%200%201%2020%207v2h1v6h-1v2a3%203%200%200%201-2.614%202.975L16.883%2024H7.117l-.503-4.025A3%203%200%200%201%204%2017V7a3%203%200%200%201%202.614-2.975zM7%2018h10a1%201%200%200%200%201-1V7a1%201%200%200%200-1-1H7a1%201%200%200%200-1%201v10a1%201%200%200%200%201%201%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%22M7.117%200h9.766l.503%204.025A3%203%200%200%201%2020%207v2h1v6h-1v2a3%203%200%200%201-2.614%202.975L16.883%2024H7.117l-.503-4.025A3%203%200%200%201%204%2017V7a3%203%200%200%201%202.614-2.975zM7%2018h10a1%201%200%200%200%201-1V7a1%201%200%200%200-1-1H7a1%201%200%200%200-1%201v10a1%201%200%200%200%201%201%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/tdesign/watch-filled.svg?color=%231a73e8&size=48
