mouse icon
mouse-line from MingCute Icon by MingCute Design · Line · Apache-2.0 Free for personal and commercial use.
- Name
- mouse-line
- Set
- MingCute Icon
- Style
- Line
- Viewbox
- 24×24
- License
- Apache 2.0
1 other variant in MingCute Icon
The same icon in other sets
All mouse icons →mouseBootstrap IconsmouseBoxIcons v2mouseBoxIcons v2 SolidmouseEmoji One (Colored)mouseElement PlusmouseFont Awesome SolidmouseFluent EmojimouseFluent Emoji FlatmouseFluent Emoji High ContrastmouseFirefox OS Emojimousecss.ggmouseIconParkmouseIconPark OutlinemouseIconPark SolidmouseIconPark TwoTonemouseIonIconsmouseKeyline IconsmouseLine AwesomemouseLucidemouseMage IconsmouseMajesticonsmouseMaterial SymbolsmouseMaterial Symbols LightmouseMaterial Design Icons
Use the mouse icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 7v4m-1 10h2a5 5 0 0 0 5-5V8a5 5 0 0 0-5-5h-2a5 5 0 0 0-5 5v8a5 5 0 0 0 5 5"/></svg>
React
import type { SVGProps } from "react";
export function MingcuteMouseLine(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 7v4m-1 10h2a5 5 0 0 0 5-5V8a5 5 0 0 0-5-5h-2a5 5 0 0 0-5 5v8a5 5 0 0 0 5 5"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 7v4m-1 10h2a5 5 0 0 0 5-5V8a5 5 0 0 0-5-5h-2a5 5 0 0 0-5 5v8a5 5 0 0 0 5 5"/></svg> </template>
CSS
.icon-mouse-line {
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%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M12%207v4m-1%2010h2a5%205%200%200%200%205-5V8a5%205%200%200%200-5-5h-2a5%205%200%200%200-5%205v8a5%205%200%200%200%205%205%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%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M12%207v4m-1%2010h2a5%205%200%200%200%205-5V8a5%205%200%200%200-5-5h-2a5%205%200%200%200-5%205v8a5%205%200%200%200%205%205%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mingcute/mouse-line.svg?color=%231a73e8&size=48