mouse icon
mouse from Unicons by Iconscout · Line · Devices · Apache-2.0 Free for personal and commercial use.
- Name
- mouse
- Set
- Unicons
- Style
- Line
- Category
- Devices
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- computer-mouse
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
More devices icons from Unicons
Use the mouse icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a7 7 0 0 0-7 7v6a7 7 0 0 0 14 0V9a7 7 0 0 0-7-7M7 9a5 5 0 0 1 4-4.9V10H7Zm10 6a5 5 0 0 1-10 0v-3h10Zm0-5h-4V4.1A5 5 0 0 1 17 9Z"/></svg>
React
import type { SVGProps } from "react";
export function UilMouse(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="M12 2a7 7 0 0 0-7 7v6a7 7 0 0 0 14 0V9a7 7 0 0 0-7-7M7 9a5 5 0 0 1 4-4.9V10H7Zm10 6a5 5 0 0 1-10 0v-3h10Zm0-5h-4V4.1A5 5 0 0 1 17 9Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a7 7 0 0 0-7 7v6a7 7 0 0 0 14 0V9a7 7 0 0 0-7-7M7 9a5 5 0 0 1 4-4.9V10H7Zm10 6a5 5 0 0 1-10 0v-3h10Zm0-5h-4V4.1A5 5 0 0 1 17 9Z"/></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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202a7%207%200%200%200-7%207v6a7%207%200%200%200%2014%200V9a7%207%200%200%200-7-7M7%209a5%205%200%200%201%204-4.9V10H7Zm10%206a5%205%200%200%201-10%200v-3h10Zm0-5h-4V4.1A5%205%200%200%201%2017%209Z%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%22M12%202a7%207%200%200%200-7%207v6a7%207%200%200%200%2014%200V9a7%207%200%200%200-7-7M7%209a5%205%200%200%201%204-4.9V10H7Zm10%206a5%205%200%200%201-10%200v-3h10Zm0-5h-4V4.1A5%205%200%200%201%2017%209Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/uil/mouse.svg?color=%231a73e8&size=48
