Home/Libraries/Cuida Icons (Iconify)/mouse-outline

Cuida Icons (Iconify)

MouseOutline

License: Apache-2.0Commercial Safe

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24"><g class="mouse-outline"><g fill="#818cf8" class="Vector"><path fill-rule="evenodd" d="M5 9a7 7 0 0 1 14 0v6a7 7 0 1 1-14 0zm7-5a5 5 0 0 0-5 5v6a5 5 0 0 0 10 0V9a5 5 0 0 0-5-5" clip-rule="evenodd"/><path d="M12 11.778c-1.102 0-2-.898-2-2V8c0-1.102.898-2 2-2s2 .898 2 2v1.778c0 1.102-.898 2-2 2m0-4.445a.67.67 0 0 0-.667.667v1.778c0 .364.303.666.667.666a.67.67 0 0 0 .667-.666V8A.67.67 0 0 0 12 7.333"/><path fill-rule="evenodd" d="M10 9.778c0 1.102.898 2 2 2s2-.898 2-2V8c0-1.102-.898-2-2-2s-2 .898-2 2zM11.333 8c0-.364.303-.667.667-.667s.667.303.667.667v1.778a.67.67 0 0 1-.667.666a.67.67 0 0 1-.667-.666z" clip-rule="evenodd"/><path fill-rule="evenodd" d="M10.2 9.778c0 .992.808 1.8 1.8 1.8s1.8-.808 1.8-1.8V8c0-.992-.808-1.8-1.8-1.8s-1.8.808-1.8 1.8zM11.133 8c0-.475.392-.867.867-.867s.867.392.867.867v1.778a.87.87 0 0 1-.867.866a.87.87 0 0 1-.867-.866zM12 11.778c-1.102 0-2-.898-2-2V8c0-1.102.898-2 2-2s2 .898 2 2v1.778c0 1.102-.898 2-2 2m0-4.445a.67.67 0 0 0-.667.667v1.778c0 .364.303.666.667.666a.67.67 0 0 0 .667-.666V8A.67.67 0 0 0 12 7.333" clip-rule="evenodd"/><path fill-rule="evenodd" d="M12.9 2.6v4.3h-1.8V2.6z" clip-rule="evenodd"/></g></g></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. MouseOutlineIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **Apache-2.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.