Inbox Notification Icon
Free SVG icon from the Mage Icons collection. Download or copy for use in any project.
The Inbox Notification icon is commonly used in alert panels, push notification UIs and dashboard headers. Available as a free SVG - copy the code or download directly.
img tag
<img src="https://proicons.com/icon/310181.svg" alt="Inbox Notification icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/310181.svg" alt="Inbox Notification icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/310181.svg" alt="Inbox Notification icon" :width="24" :height="24" />
CSS background
.icon-inbox-notification {
background-image: url('https://proicons.com/icon/310181.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_1327_10)"> <path d="M21.875 10.495V15.375C21.8724 17.1644 21.1603 18.8798 19.895 20.1451C18.6298 21.4104 16.9144 22.1224 15.125 22.125H8.625C6.8356 22.1224 5.12025 21.4104 3.85495 20.1451C2.58965 18.8798 1.87764 17.1644 1.875 15.375V8.87501C1.87764 7.08561 2.58965 5.37025 3.85495 4.10496C5.12025 2.83966 6.8356 2.12765 8.625 2.12501H13.495C13.6939 2.12501 13.8847 2.20402 14.0253 2.34467C14.166 2.48532 14.245 2.67609 14.245 2.87501C14.245 3.07392 14.166 3.26467 14.0253 3.40532C13.8847 3.54598 13.6939 3.62501 13.495 3.62501H8.625C7.23261 3.62501 5.89725 4.17813 4.91269 5.16269C3.92812 6.14726 3.375 7.48262 3.375 8.87501V11.375H5.875C6.60434 11.375 7.30382 11.6647 7.81955 12.1805C8.33527 12.6962 8.625 13.3957 8.625 14.125C8.625 14.4565 8.7567 14.7745 8.99112 15.0089C9.22554 15.2433 9.54348 15.375 9.875 15.375H13.875C14.2057 15.3724 14.5221 15.2398 14.756 15.006C14.9899 14.7721 15.1224 14.4557 15.125 14.125C15.1223 13.7631 15.1917 13.4043 15.3289 13.0695C15.4662 12.7346 15.6686 12.4304 15.9245 12.1745C16.1804 11.9186 16.4846 11.7162 16.8195 11.5789C17.1543 11.4417 17.5131 11.3723 17.875 11.375H20.375V10.495C20.375 10.2961 20.454 10.1053 20.5947 9.96467C20.7353 9.82401 20.9261 9.745 21.125 9.745C21.3239 9.745 21.5147 9.82401 21.6553 9.96467C21.796 10.1053 21.875 10.2961 21.875 10.495Z" fill="black"/> <path d="M18.875 8.375C20.6699 8.375 22.125 6.91993 22.125 5.125C22.125 3.33007 20.6699 1.875 18.875 1.875C17.0801 1.875 15.625 3.33007 15.625 5.125C15.625 6.91993 17.0801 8.375 18.875 8.375Z" fill="black"/> </g> <defs> <clipPath id="clip0_1327_10"> <rect width="20.25" height="20.25" fill="white" transform="translate(1.875 1.875)"/> </clipPath> </defs> </svg>
Copied!