bib icon
bib from IconPark by ByteDance · Color · Baby · Apache-2.0 Free for personal and commercial use.
- Name
- bib
- Set
- IconPark
- Style
- Color
- Category
- Baby
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
More baby icons from IconPark
Use the bib icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" stroke="#000" d="M31 14.0001C31 22.0002 17 22.0002 17 14.0001C17 9.00016 22 8.00008 20 5.0001C18 2.0001 8 7.00005 8 16.0001V32C8 40.5 16.5 44 23.5 44C30.5 44.0001 40 41.0001 40 32V16.0002C40 7.00016 29 2.00012 27 5.0001C25 8.00008 31 9.00016 31 14.0001Z"/><path fill="#43CCF8" stroke="#fff" stroke-linecap="round" d="M19 32L24 27L29 32L24 37L19 32Z"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkBib(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" strokeLinejoin="round" strokeWidth="4"><path fill="#2F88FF" stroke="#000" d="M31 14.0001C31 22.0002 17 22.0002 17 14.0001C17 9.00016 22 8.00008 20 5.0001C18 2.0001 8 7.00005 8 16.0001V32C8 40.5 16.5 44 23.5 44C30.5 44.0001 40 41.0001 40 32V16.0002C40 7.00016 29 2.00012 27 5.0001C25 8.00008 31 9.00016 31 14.0001Z"/><path fill="#43CCF8" stroke="#fff" strokeLinecap="round" d="M19 32L24 27L29 32L24 37L19 32Z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" stroke="#000" d="M31 14.0001C31 22.0002 17 22.0002 17 14.0001C17 9.00016 22 8.00008 20 5.0001C18 2.0001 8 7.00005 8 16.0001V32C8 40.5 16.5 44 23.5 44C30.5 44.0001 40 41.0001 40 32V16.0002C40 7.00016 29 2.00012 27 5.0001C25 8.00008 31 9.00016 31 14.0001Z"/><path fill="#43CCF8" stroke="#fff" stroke-linecap="round" d="M19 32L24 27L29 32L24 37L19 32Z"/></g></svg> </template>
CSS
.icon-bib {
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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20d%3D%22M31%2014.0001C31%2022.0002%2017%2022.0002%2017%2014.0001C17%209.00016%2022%208.00008%2020%205.0001C18%202.0001%208%207.00005%208%2016.0001V32C8%2040.5%2016.5%2044%2023.5%2044C30.5%2044.0001%2040%2041.0001%2040%2032V16.0002C40%207.00016%2029%202.00012%2027%205.0001C25%208.00008%2031%209.00016%2031%2014.0001Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20d%3D%22M19%2032L24%2027L29%2032L24%2037L19%2032Z%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20d%3D%22M31%2014.0001C31%2022.0002%2017%2022.0002%2017%2014.0001C17%209.00016%2022%208.00008%2020%205.0001C18%202.0001%208%207.00005%208%2016.0001V32C8%2040.5%2016.5%2044%2023.5%2044C30.5%2044.0001%2040%2041.0001%2040%2032V16.0002C40%207.00016%2029%202.00012%2027%205.0001C25%208.00008%2031%209.00016%2031%2014.0001Z%22%2F%3E%3Cpath%20fill%3D%22%2343CCF8%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20d%3D%22M19%2032L24%2027L29%2032L24%2037L19%2032Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park/bib.svg?color=%231a73e8&size=48
