alert urgent icon
alert-urgent-20-regular from Fluent UI System Icons by Microsoft Corporation · 20 Regular · MIT Free for personal and commercial use.
- Name
- alert-urgent-20-regular
- Set
- Fluent UI System Icons
- Style
- 20 Regular
- Viewbox
- 20×20
- License
- MIT
5 other variants in Fluent UI System Icons
The same icon in other sets
Related icons in Fluent UI System Icons
Use the alert urgent icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M13.264 2.078a.5.5 0 1 0-.523.852c2.258 1.384 4.12 3.414 4.26 7.09A.5.5 0 0 0 18 9.982c-.157-4.099-2.278-6.398-4.736-7.904m-1.178 2.65a.5.5 0 0 1 .694-.134c1.607 1.085 2.715 2.638 2.888 4.424q.024.24.024.487a.5.5 0 0 1-1 0q0-.198-.02-.39c-.136-1.418-1.024-2.728-2.452-3.693a.5.5 0 0 1-.134-.694m-7.006.71a5.16 5.16 0 0 0-2.614 6.811l1.223 2.749l.09 2.32a.75.75 0 0 0 1.054.656l9.727-4.33a.75.75 0 0 0 .218-1.223l-1.664-1.619l-1.224-2.749a5.16 5.16 0 0 0-6.81-2.614m-1.7 6.404a4.158 4.158 0 0 1 7.596-3.382l1.302 2.925l1.538 1.495l-9.052 4.03l-.083-2.143zm7.298 6.034a1.49 1.49 0 0 1-1.848-.54l2.685-1.194a1.49 1.49 0 0 1-.837 1.734"/></svg>
React
import type { SVGProps } from "react";
export function FluentAlertUrgent20Regular(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M13.264 2.078a.5.5 0 1 0-.523.852c2.258 1.384 4.12 3.414 4.26 7.09A.5.5 0 0 0 18 9.982c-.157-4.099-2.278-6.398-4.736-7.904m-1.178 2.65a.5.5 0 0 1 .694-.134c1.607 1.085 2.715 2.638 2.888 4.424q.024.24.024.487a.5.5 0 0 1-1 0q0-.198-.02-.39c-.136-1.418-1.024-2.728-2.452-3.693a.5.5 0 0 1-.134-.694m-7.006.71a5.16 5.16 0 0 0-2.614 6.811l1.223 2.749l.09 2.32a.75.75 0 0 0 1.054.656l9.727-4.33a.75.75 0 0 0 .218-1.223l-1.664-1.619l-1.224-2.749a5.16 5.16 0 0 0-6.81-2.614m-1.7 6.404a4.158 4.158 0 0 1 7.596-3.382l1.302 2.925l1.538 1.495l-9.052 4.03l-.083-2.143zm7.298 6.034a1.49 1.49 0 0 1-1.848-.54l2.685-1.194a1.49 1.49 0 0 1-.837 1.734"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M13.264 2.078a.5.5 0 1 0-.523.852c2.258 1.384 4.12 3.414 4.26 7.09A.5.5 0 0 0 18 9.982c-.157-4.099-2.278-6.398-4.736-7.904m-1.178 2.65a.5.5 0 0 1 .694-.134c1.607 1.085 2.715 2.638 2.888 4.424q.024.24.024.487a.5.5 0 0 1-1 0q0-.198-.02-.39c-.136-1.418-1.024-2.728-2.452-3.693a.5.5 0 0 1-.134-.694m-7.006.71a5.16 5.16 0 0 0-2.614 6.811l1.223 2.749l.09 2.32a.75.75 0 0 0 1.054.656l9.727-4.33a.75.75 0 0 0 .218-1.223l-1.664-1.619l-1.224-2.749a5.16 5.16 0 0 0-6.81-2.614m-1.7 6.404a4.158 4.158 0 0 1 7.596-3.382l1.302 2.925l1.538 1.495l-9.052 4.03l-.083-2.143zm7.298 6.034a1.49 1.49 0 0 1-1.848-.54l2.685-1.194a1.49 1.49 0 0 1-.837 1.734"/></svg> </template>
CSS
.icon-alert-urgent-20-regular {
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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M13.264%202.078a.5.5%200%201%200-.523.852c2.258%201.384%204.12%203.414%204.26%207.09A.5.5%200%200%200%2018%209.982c-.157-4.099-2.278-6.398-4.736-7.904m-1.178%202.65a.5.5%200%200%201%20.694-.134c1.607%201.085%202.715%202.638%202.888%204.424q.024.24.024.487a.5.5%200%200%201-1%200q0-.198-.02-.39c-.136-1.418-1.024-2.728-2.452-3.693a.5.5%200%200%201-.134-.694m-7.006.71a5.16%205.16%200%200%200-2.614%206.811l1.223%202.749l.09%202.32a.75.75%200%200%200%201.054.656l9.727-4.33a.75.75%200%200%200%20.218-1.223l-1.664-1.619l-1.224-2.749a5.16%205.16%200%200%200-6.81-2.614m-1.7%206.404a4.158%204.158%200%200%201%207.596-3.382l1.302%202.925l1.538%201.495l-9.052%204.03l-.083-2.143zm7.298%206.034a1.49%201.49%200%200%201-1.848-.54l2.685-1.194a1.49%201.49%200%200%201-.837%201.734%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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M13.264%202.078a.5.5%200%201%200-.523.852c2.258%201.384%204.12%203.414%204.26%207.09A.5.5%200%200%200%2018%209.982c-.157-4.099-2.278-6.398-4.736-7.904m-1.178%202.65a.5.5%200%200%201%20.694-.134c1.607%201.085%202.715%202.638%202.888%204.424q.024.24.024.487a.5.5%200%200%201-1%200q0-.198-.02-.39c-.136-1.418-1.024-2.728-2.452-3.693a.5.5%200%200%201-.134-.694m-7.006.71a5.16%205.16%200%200%200-2.614%206.811l1.223%202.749l.09%202.32a.75.75%200%200%200%201.054.656l9.727-4.33a.75.75%200%200%200%20.218-1.223l-1.664-1.619l-1.224-2.749a5.16%205.16%200%200%200-6.81-2.614m-1.7%206.404a4.158%204.158%200%200%201%207.596-3.382l1.302%202.925l1.538%201.495l-9.052%204.03l-.083-2.143zm7.298%206.034a1.49%201.49%200%200%201-1.848-.54l2.685-1.194a1.49%201.49%200%200%201-.837%201.734%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/alert-urgent-20-regular.svg?color=%231a73e8&size=48
