Home/Libraries/Freehand free icons (Iconify)/push-notification-2

Freehand free icons (Iconify)

PushNotification2

License: CC-BY-4.0

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"><path fill="#818cf8" d="M14.184 17.662a.31.31 0 0 0-.31.3v.771c-1.563-.07-3.125-.23-4.677-.33c-1.092-.06-2.174-.12-3.175-.11c-1.58.032-3.156.17-4.717.41c-.11-2.363-.17-5.798-.12-8.953c0-3.625.17-6.88.65-7.652c.09-.14.361-.22.712-.33a14 14 0 0 1 2.553-.42a30.5 30.5 0 0 1 5.669 0q.778.077 1.532.28c.35.1.621.19.711.34q.09.197.12.41q.092.378.14.762a.36.36 0 0 0 .391.3a.35.35 0 0 0 .29-.39a9 9 0 0 0-.16-1.002a1.3 1.3 0 0 0-.16-.47a1.56 1.56 0 0 0-.84-.601a9.4 9.4 0 0 0-1.914-.36a31 31 0 0 0-6.86-.09a8.8 8.8 0 0 0-2.394.52c-.244.115-.454.29-.61.51C.462 2.37.112 5.845.012 9.73c-.08 5.258.23 11.197.54 12.138A2.14 2.14 0 0 0 1.947 23c1.8.488 3.665.69 5.528.6a18.2 18.2 0 0 0 5.458-.8c.514-.153.964-.47 1.282-.902c.133-.407.204-.833.21-1.262c0-.66.06-1.572.06-2.644a.3.3 0 0 0-.3-.33m-.57 3.856a1.72 1.72 0 0 1-.942.56a17.3 17.3 0 0 1-5.208.601A16.6 16.6 0 0 1 2.306 22c-.36-.14-.65-.25-.72-.451a13.5 13.5 0 0 1-.241-2.164c1.392 0 2.764 0 4.126.06l3.125.08q2.633 0 5.228-.09v.782c-.02.44-.09.877-.21 1.302"/><path fill="#818cf8" d="M13.373 4.652a19.4 19.4 0 0 0-2.894-.15a41 41 0 0 0-7.011.34c-.46.1-.56.341-.6.461a8 8 0 0 0-.261 2.003c-.027.426.02.853.14 1.262a.87.87 0 0 0 .27.41c.906.238 1.838.366 2.774.381c2.184.14 5.088.22 6.11.24q.75.029 1.492-.08c.33-.044.633-.208.851-.46a.94.94 0 0 0 .18-.48a12 12 0 0 0 0-2.004a4.7 4.7 0 0 0-.23-1.222a1.3 1.3 0 0 0-.31-.48a1.24 1.24 0 0 0-.511-.22m-.07 3.676s-.29.06-.43.07H5.861q-1.207.03-2.404-.12a.8.8 0 0 1-.08-.24a3.5 3.5 0 0 1-.09-.772q-.03-.812.11-1.612a1 1 0 0 0 0-.15c.4-.1 3.395-.12 6.009-.06c1.292 0 2.484.1 3.245.2c.24 0 .55.07.55.07v.52q.114 1.045.1 2.094m3.137 3.704a1.15 1.15 0 0 0-.31-.47a1.4 1.4 0 0 0-.532-.21a17.6 17.6 0 0 0-2.884-.16c-4.887 0-6.44.14-7.07.35c-.431.14-.532.34-.562.45a8.6 8.6 0 0 0-.27 2.003c-.023.423.028.847.15 1.252c.06.168.172.312.32.41c.899.22 1.82.331 2.745.331c2.183.15 5.098.23 6.12.25c.495.021.992-.01 1.481-.09c.331-.044.636-.203.862-.45a1.16 1.16 0 0 0 .18-.49a12 12 0 0 0 0-2.004a4.8 4.8 0 0 0-.23-1.172m-.902 2.955h-.05a2 2 0 0 1-.37.06H8.095c-.802.047-1.606.027-2.404-.06a1 1 0 0 1-.09-.24a3.4 3.4 0 0 1-.08-.762q.02-.884.13-1.762c.4-.09 3.395-.12 6.01-.06c1.291 0 2.894.13 3.655.18c.15 0 .14.47.16.62c.087.671.107 1.35.06 2.024m.651-8.593q.57.156 1.152.25q.245.024.49 0q.246.015.491 0c.441-.06.832-.15 1.152-.2a.35.35 0 0 0 .35-.35a.35.35 0 0 0-.35-.341c-.32-.06-.711-.15-1.152-.2a3.5 3.5 0 0 0-1.001 0a11 11 0 0 0-1.152.25a.3.3 0 0 0 0 .6zm4.507 6.81c.34-.05.63-.14.891-.2a.34.34 0 0 0 0-.681c-.26-.06-.55-.15-.891-.21q-.195-.015-.39 0a1.6 1.6 0 0 0-.381 0q-.454.094-.891.25a.3.3 0 0 0 0 .6q.436.157.89.251q.191.015.381 0q.195.01.391-.01m-.651-4.226c.721 0 1.442-.15 2.163-.23a.34.34 0 1 0 0-.682c-.72-.09-1.442-.24-2.163-.28a6 6 0 0 0-.861 0a6 6 0 0 0-.581.05c-.23 0-.601.11-.942.14c-.172.03-.348.03-.52 0a.305.305 0 0 0-.24.561q.266.132.56.18c.39.09.861.12 1.142.16s.38 0 .58.06q.43.045.862.04m3.666 5.529c-.341-.06-.742-.15-1.172-.2a4 4 0 0 0-.501 0a3 3 0 0 0-.5 0c-.441.06-.832.18-1.173.25a.31.31 0 0 0 0 .611c.341.07.732.19 1.172.25q.25.015.501 0h.5c.431-.05.832-.14 1.172-.2a.35.35 0 0 0 0-.69z"/></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. PushNotification2Icon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-4.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.