umbrella icon
umbrella-fill from Keyline Icons by Keyline Icons · Fill · MIT Free for personal and commercial use.
- Name
- umbrella-fill
- Set
- Keyline Icons
- Style
- Fill
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
The same icon in other sets
umbrellaAkar IconsumbrellaBootstrap IconsumbrellaCarbonumbrellaEmoji One (Colored)umbrellaElement Plusumbrella-fillEva IconsumbrellaFramework7 IconsumbrellaFont Awesome 6 SolidumbrellaFont Awesome SolidumbrellaFeather Iconsumbrella-20-filledFluent UI System IconsumbrellaFluent EmojiumbrellaFluent Emoji FlatumbrellaFluent Emoji High ContrastumbrellaFirefox OS Emojiumbrellacss.ggumbrellaHealth IconsumbrellaHuge IconsumbrellaIconParkumbrellaIconPark OutlineumbrellaIconPark SolidumbrellaIconPark TwoToneumbrellaIconoirumbrellaIonIcons
Related icons in Keyline Icons
Use the umbrella icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" d="M1 12C1 5.9249 5.9249 1 12 1C18.0751 1 23 5.9249 23 12C23 13.0047 21.6845 13.382 21.152 12.53C20.2937 11.1567 18.7063 11.1567 17.848 12.53C17.4563 13.1567 16.5437 13.1567 16.152 12.53C15.2937 11.1567 13.7063 11.1567 12.848 12.53C12.4563 13.1567 11.5437 13.1567 11.152 12.53C10.2937 11.1567 8.7063 11.1567 7.848 12.53C7.4563 13.1567 6.5437 13.1567 6.152 12.53C5.2937 11.1567 3.7063 11.1567 2.848 12.53C2.3155 13.382 1 13.0047 1 12Z" stroke="none"/><path d="M12 12V19C12 20.6569 13.3431 22 15 22C16.6569 22 18 20.6569 18 19"/></g></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsUmbrellaFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"><path fill="currentColor" d="M1 12C1 5.9249 5.9249 1 12 1C18.0751 1 23 5.9249 23 12C23 13.0047 21.6845 13.382 21.152 12.53C20.2937 11.1567 18.7063 11.1567 17.848 12.53C17.4563 13.1567 16.5437 13.1567 16.152 12.53C15.2937 11.1567 13.7063 11.1567 12.848 12.53C12.4563 13.1567 11.5437 13.1567 11.152 12.53C10.2937 11.1567 8.7063 11.1567 7.848 12.53C7.4563 13.1567 6.5437 13.1567 6.152 12.53C5.2937 11.1567 3.7063 11.1567 2.848 12.53C2.3155 13.382 1 13.0047 1 12Z" stroke="none"/><path d="M12 12V19C12 20.6569 13.3431 22 15 22C16.6569 22 18 20.6569 18 19"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" d="M1 12C1 5.9249 5.9249 1 12 1C18.0751 1 23 5.9249 23 12C23 13.0047 21.6845 13.382 21.152 12.53C20.2937 11.1567 18.7063 11.1567 17.848 12.53C17.4563 13.1567 16.5437 13.1567 16.152 12.53C15.2937 11.1567 13.7063 11.1567 12.848 12.53C12.4563 13.1567 11.5437 13.1567 11.152 12.53C10.2937 11.1567 8.7063 11.1567 7.848 12.53C7.4563 13.1567 6.5437 13.1567 6.152 12.53C5.2937 11.1567 3.7063 11.1567 2.848 12.53C2.3155 13.382 1 13.0047 1 12Z" stroke="none"/><path d="M12 12V19C12 20.6569 13.3431 22 15 22C16.6569 22 18 20.6569 18 19"/></g></svg> </template>
CSS
.icon-umbrella-fill {
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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1%2012C1%205.9249%205.9249%201%2012%201C18.0751%201%2023%205.9249%2023%2012C23%2013.0047%2021.6845%2013.382%2021.152%2012.53C20.2937%2011.1567%2018.7063%2011.1567%2017.848%2012.53C17.4563%2013.1567%2016.5437%2013.1567%2016.152%2012.53C15.2937%2011.1567%2013.7063%2011.1567%2012.848%2012.53C12.4563%2013.1567%2011.5437%2013.1567%2011.152%2012.53C10.2937%2011.1567%208.7063%2011.1567%207.848%2012.53C7.4563%2013.1567%206.5437%2013.1567%206.152%2012.53C5.2937%2011.1567%203.7063%2011.1567%202.848%2012.53C2.3155%2013.382%201%2013.0047%201%2012Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M12%2012V19C12%2020.6569%2013.3431%2022%2015%2022C16.6569%2022%2018%2020.6569%2018%2019%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1%2012C1%205.9249%205.9249%201%2012%201C18.0751%201%2023%205.9249%2023%2012C23%2013.0047%2021.6845%2013.382%2021.152%2012.53C20.2937%2011.1567%2018.7063%2011.1567%2017.848%2012.53C17.4563%2013.1567%2016.5437%2013.1567%2016.152%2012.53C15.2937%2011.1567%2013.7063%2011.1567%2012.848%2012.53C12.4563%2013.1567%2011.5437%2013.1567%2011.152%2012.53C10.2937%2011.1567%208.7063%2011.1567%207.848%2012.53C7.4563%2013.1567%206.5437%2013.1567%206.152%2012.53C5.2937%2011.1567%203.7063%2011.1567%202.848%2012.53C2.3155%2013.382%201%2013.0047%201%2012Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M12%2012V19C12%2020.6569%2013.3431%2022%2015%2022C16.6569%2022%2018%2020.6569%2018%2019%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/umbrella-fill.svg?color=%231a73e8&size=48
