mouse icon
mouse from TDesign Icons by TDesign · Outline · MIT Free for personal and commercial use.
- Name
- mouse
- Set
- TDesign Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- MIT
1 other variant in TDesign Icons
The same icon in other sets
mouseBootstrap IconsmouseBoxIcons v2mouseBoxIcons v2 SolidmouseEmoji One (Colored)mouseElement PlusmouseFont Awesome SolidmouseFluent EmojimouseFluent Emoji FlatmouseFluent Emoji High ContrastmouseFirefox OS Emojimousecss.ggmouseIconParkmouseIconPark OutlinemouseIconPark SolidmouseIconPark TwoTonemouseIonIconsmouseLine AwesomemouseLucidemouseMage IconsmouseMajesticonsmouseMaterial SymbolsmouseMaterial Symbols LightmouseMaterial Design Iconsmouse-fillMingCute Icon
Use the mouse icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M5 10h14v5a7 7 0 1 1-14 0z"/><path stroke="currentColor" stroke-width="2" d="M19 10v5a7 7 0 1 1-14 0v-5m14 0h-7m7 0V9a7 7 0 0 0-7-7m-7 8h7m-7 0V9a7 7 0 0 1 7-7m0 8V2"/></g></svg>
React
import type { SVGProps } from "react";
export function TdesignMouse(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M5 10h14v5a7 7 0 1 1-14 0z"/><path stroke="currentColor" strokeWidth="2" d="M19 10v5a7 7 0 1 1-14 0v-5m14 0h-7m7 0V9a7 7 0 0 0-7-7m-7 8h7m-7 0V9a7 7 0 0 1 7-7m0 8V2"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M5 10h14v5a7 7 0 1 1-14 0z"/><path stroke="currentColor" stroke-width="2" d="M19 10v5a7 7 0 1 1-14 0v-5m14 0h-7m7 0V9a7 7 0 0 0-7-7m-7 8h7m-7 0V9a7 7 0 0 1 7-7m0 8V2"/></g></svg> </template>
CSS
.icon-mouse {
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%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M5%2010h14v5a7%207%200%201%201-14%200z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20d%3D%22M19%2010v5a7%207%200%201%201-14%200v-5m14%200h-7m7%200V9a7%207%200%200%200-7-7m-7%208h7m-7%200V9a7%207%200%200%201%207-7m0%208V2%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M5%2010h14v5a7%207%200%201%201-14%200z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20d%3D%22M19%2010v5a7%207%200%201%201-14%200v-5m14%200h-7m7%200V9a7%207%200%200%200-7-7m-7%208h7m-7%200V9a7%207%200%200%201%207-7m0%208V2%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/tdesign/mouse.svg?color=%231a73e8&size=48
