mouse icon
mouse from IconPark TwoTone by ByteDance · Two tone · Hardware · Apache-2.0 Free for personal and commercial use.
- Name
- mouse
- Set
- IconPark TwoTone
- Style
- Two tone
- Category
- Hardware
- Viewbox
- 48×48
- License
- Apache 2.0
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 SolidmouseIonIconsmouseLine AwesomemouseLucidemouseMage IconsmouseMajesticonsmouseMaterial SymbolsmouseMaterial Symbols LightmouseMaterial Design Iconsmouse-fillMingCute IconmouseNoto Emoji
More hardware icons from IconPark TwoTone
Use the mouse icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGp6iL6bft"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#555" fill-rule="evenodd" d="M24 16H12v16c0 6.627 5.373 12 12 12s12-5.373 12-12V16z" clip-rule="evenodd"/><path d="M36 16c0-6.627-5.373-12-12-12v12zM24 4c-6.627 0-12 5.373-12 12h12z"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGp6iL6bft)"/></svg>
React
import type { SVGProps } from "react";
export function IconParkTwotoneMouse(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="SVGp6iL6bft"><g fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4"><path fill="#555" fillRule="evenodd" d="M24 16H12v16c0 6.627 5.373 12 12 12s12-5.373 12-12V16z" clipRule="evenodd"/><path d="M36 16c0-6.627-5.373-12-12-12v12zM24 4c-6.627 0-12 5.373-12 12h12z"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGp6iL6bft)"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGp6iL6bft"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#555" fill-rule="evenodd" d="M24 16H12v16c0 6.627 5.373 12 12 12s12-5.373 12-12V16z" clip-rule="evenodd"/><path d="M36 16c0-6.627-5.373-12-12-12v12zM24 4c-6.627 0-12 5.373-12 12h12z"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGp6iL6bft)"/></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%2048%2048%22%3E%3Cdefs%3E%3Cmask%20id%3D%22SVGp6iL6bft%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%20fill%3D%22%23555%22%20fill-rule%3D%22evenodd%22%20d%3D%22M24%2016H12v16c0%206.627%205.373%2012%2012%2012s12-5.373%2012-12V16z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M36%2016c0-6.627-5.373-12-12-12v12zM24%204c-6.627%200-12%205.373-12%2012h12z%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(%23SVGp6iL6bft)%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%22SVGp6iL6bft%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%20fill%3D%22%23555%22%20fill-rule%3D%22evenodd%22%20d%3D%22M24%2016H12v16c0%206.627%205.373%2012%2012%2012s12-5.373%2012-12V16z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M36%2016c0-6.627-5.373-12-12-12v12zM24%204c-6.627%200-12%205.373-12%2012h12z%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(%23SVGp6iL6bft)%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-twotone/mouse.svg?color=%231a73e8&size=48
