lifebuoy icon
lifebuoy from HeroIcons by Refactoring UI Inc · Outline 24x24 · MIT Free for personal and commercial use.
- Name
- lifebuoy
- Set
- HeroIcons
- Style
- Outline 24x24
- Viewbox
- 24×24
- License
- MIT
3 other variants in HeroIcons
The same icon in other sets
Use the lifebuoy icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M16.712 4.33a9 9 0 0 1 1.652 1.306c.51.51.944 1.064 1.306 1.652M16.712 4.33l-3.448 4.138m3.448-4.138a9.01 9.01 0 0 0-9.424 0M19.67 7.288l-4.138 3.448m4.138-3.448a9.01 9.01 0 0 1 0 9.424m-4.138-5.976a3.7 3.7 0 0 0-.88-1.388a3.7 3.7 0 0 0-1.388-.88m2.268 2.268a3.77 3.77 0 0 1 0 2.528m-2.268-4.796a3.77 3.77 0 0 0-2.528 0m4.796 4.796a3.75 3.75 0 0 1-.88 1.388a3.7 3.7 0 0 1-1.388.88m2.268-2.268l4.138 3.448m0 0a9 9 0 0 1-1.306 1.652c-.51.51-1.064.944-1.652 1.306m0 0l-3.448-4.138m3.448 4.138a9.01 9.01 0 0 1-9.424 0m5.976-4.138a3.77 3.77 0 0 1-2.528 0m0 0a3.7 3.7 0 0 1-1.388-.88a3.7 3.7 0 0 1-.88-1.388m2.268 2.268L7.288 19.67m0 0a9 9 0 0 1-1.652-1.306a9 9 0 0 1-1.306-1.652m0 0l4.138-3.448M4.33 16.712a9.01 9.01 0 0 1 0-9.424m4.138 5.976a3.77 3.77 0 0 1 0-2.528m0 0c.181-.506.475-.982.88-1.388a3.7 3.7 0 0 1 1.388-.88m-2.268 2.268L4.33 7.288m6.406 1.18L7.288 4.33m0 0a9 9 0 0 0-1.652 1.306A9 9 0 0 0 4.33 7.288"/></svg>
React
import type { SVGProps } from "react";
export function HeroiconsLifebuoy(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M16.712 4.33a9 9 0 0 1 1.652 1.306c.51.51.944 1.064 1.306 1.652M16.712 4.33l-3.448 4.138m3.448-4.138a9.01 9.01 0 0 0-9.424 0M19.67 7.288l-4.138 3.448m4.138-3.448a9.01 9.01 0 0 1 0 9.424m-4.138-5.976a3.7 3.7 0 0 0-.88-1.388a3.7 3.7 0 0 0-1.388-.88m2.268 2.268a3.77 3.77 0 0 1 0 2.528m-2.268-4.796a3.77 3.77 0 0 0-2.528 0m4.796 4.796a3.75 3.75 0 0 1-.88 1.388a3.7 3.7 0 0 1-1.388.88m2.268-2.268l4.138 3.448m0 0a9 9 0 0 1-1.306 1.652c-.51.51-1.064.944-1.652 1.306m0 0l-3.448-4.138m3.448 4.138a9.01 9.01 0 0 1-9.424 0m5.976-4.138a3.77 3.77 0 0 1-2.528 0m0 0a3.7 3.7 0 0 1-1.388-.88a3.7 3.7 0 0 1-.88-1.388m2.268 2.268L7.288 19.67m0 0a9 9 0 0 1-1.652-1.306a9 9 0 0 1-1.306-1.652m0 0l4.138-3.448M4.33 16.712a9.01 9.01 0 0 1 0-9.424m4.138 5.976a3.77 3.77 0 0 1 0-2.528m0 0c.181-.506.475-.982.88-1.388a3.7 3.7 0 0 1 1.388-.88m-2.268 2.268L4.33 7.288m6.406 1.18L7.288 4.33m0 0a9 9 0 0 0-1.652 1.306A9 9 0 0 0 4.33 7.288"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M16.712 4.33a9 9 0 0 1 1.652 1.306c.51.51.944 1.064 1.306 1.652M16.712 4.33l-3.448 4.138m3.448-4.138a9.01 9.01 0 0 0-9.424 0M19.67 7.288l-4.138 3.448m4.138-3.448a9.01 9.01 0 0 1 0 9.424m-4.138-5.976a3.7 3.7 0 0 0-.88-1.388a3.7 3.7 0 0 0-1.388-.88m2.268 2.268a3.77 3.77 0 0 1 0 2.528m-2.268-4.796a3.77 3.77 0 0 0-2.528 0m4.796 4.796a3.75 3.75 0 0 1-.88 1.388a3.7 3.7 0 0 1-1.388.88m2.268-2.268l4.138 3.448m0 0a9 9 0 0 1-1.306 1.652c-.51.51-1.064.944-1.652 1.306m0 0l-3.448-4.138m3.448 4.138a9.01 9.01 0 0 1-9.424 0m5.976-4.138a3.77 3.77 0 0 1-2.528 0m0 0a3.7 3.7 0 0 1-1.388-.88a3.7 3.7 0 0 1-.88-1.388m2.268 2.268L7.288 19.67m0 0a9 9 0 0 1-1.652-1.306a9 9 0 0 1-1.306-1.652m0 0l4.138-3.448M4.33 16.712a9.01 9.01 0 0 1 0-9.424m4.138 5.976a3.77 3.77 0 0 1 0-2.528m0 0c.181-.506.475-.982.88-1.388a3.7 3.7 0 0 1 1.388-.88m-2.268 2.268L4.33 7.288m6.406 1.18L7.288 4.33m0 0a9 9 0 0 0-1.652 1.306A9 9 0 0 0 4.33 7.288"/></svg> </template>
CSS
.icon-lifebuoy {
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%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M16.712%204.33a9%209%200%200%201%201.652%201.306c.51.51.944%201.064%201.306%201.652M16.712%204.33l-3.448%204.138m3.448-4.138a9.01%209.01%200%200%200-9.424%200M19.67%207.288l-4.138%203.448m4.138-3.448a9.01%209.01%200%200%201%200%209.424m-4.138-5.976a3.7%203.7%200%200%200-.88-1.388a3.7%203.7%200%200%200-1.388-.88m2.268%202.268a3.77%203.77%200%200%201%200%202.528m-2.268-4.796a3.77%203.77%200%200%200-2.528%200m4.796%204.796a3.75%203.75%200%200%201-.88%201.388a3.7%203.7%200%200%201-1.388.88m2.268-2.268l4.138%203.448m0%200a9%209%200%200%201-1.306%201.652c-.51.51-1.064.944-1.652%201.306m0%200l-3.448-4.138m3.448%204.138a9.01%209.01%200%200%201-9.424%200m5.976-4.138a3.77%203.77%200%200%201-2.528%200m0%200a3.7%203.7%200%200%201-1.388-.88a3.7%203.7%200%200%201-.88-1.388m2.268%202.268L7.288%2019.67m0%200a9%209%200%200%201-1.652-1.306a9%209%200%200%201-1.306-1.652m0%200l4.138-3.448M4.33%2016.712a9.01%209.01%200%200%201%200-9.424m4.138%205.976a3.77%203.77%200%200%201%200-2.528m0%200c.181-.506.475-.982.88-1.388a3.7%203.7%200%200%201%201.388-.88m-2.268%202.268L4.33%207.288m6.406%201.18L7.288%204.33m0%200a9%209%200%200%200-1.652%201.306A9%209%200%200%200%204.33%207.288%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%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M16.712%204.33a9%209%200%200%201%201.652%201.306c.51.51.944%201.064%201.306%201.652M16.712%204.33l-3.448%204.138m3.448-4.138a9.01%209.01%200%200%200-9.424%200M19.67%207.288l-4.138%203.448m4.138-3.448a9.01%209.01%200%200%201%200%209.424m-4.138-5.976a3.7%203.7%200%200%200-.88-1.388a3.7%203.7%200%200%200-1.388-.88m2.268%202.268a3.77%203.77%200%200%201%200%202.528m-2.268-4.796a3.77%203.77%200%200%200-2.528%200m4.796%204.796a3.75%203.75%200%200%201-.88%201.388a3.7%203.7%200%200%201-1.388.88m2.268-2.268l4.138%203.448m0%200a9%209%200%200%201-1.306%201.652c-.51.51-1.064.944-1.652%201.306m0%200l-3.448-4.138m3.448%204.138a9.01%209.01%200%200%201-9.424%200m5.976-4.138a3.77%203.77%200%200%201-2.528%200m0%200a3.7%203.7%200%200%201-1.388-.88a3.7%203.7%200%200%201-.88-1.388m2.268%202.268L7.288%2019.67m0%200a9%209%200%200%201-1.652-1.306a9%209%200%200%201-1.306-1.652m0%200l4.138-3.448M4.33%2016.712a9.01%209.01%200%200%201%200-9.424m4.138%205.976a3.77%203.77%200%200%201%200-2.528m0%200c.181-.506.475-.982.88-1.388a3.7%203.7%200%200%201%201.388-.88m-2.268%202.268L4.33%207.288m6.406%201.18L7.288%204.33m0%200a9%209%200%200%200-1.652%201.306A9%209%200%200%200%204.33%207.288%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/heroicons/lifebuoy.svg?color=%231a73e8&size=48
