baby face icon
baby-face from Material Design Icons by Pictogrammers · Filled · People / Family · Apache-2.0 Free for personal and commercial use.
- Name
- baby-face
- Set
- Material Design Icons
- Style
- Filled
- Category
- People / Family
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- emoji-baby, emoticon-baby
1 other variant in Material Design Icons
More people / family icons from Material Design Icons
Use the baby face icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M1 12c0-1.81 1.2-3.34 2.86-3.83A8.97 8.97 0 0 1 12 3a9 9 0 0 1 8.15 5.17C21.8 8.66 23 10.19 23 12s-1.2 3.34-2.85 3.83A9 9 0 0 1 12 21c-3.6 0-6.71-2.11-8.14-5.17A3.99 3.99 0 0 1 1 12m13.5-2.75a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25a1.25 1.25 0 0 0-1.25-1.25m-5 0a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25A1.25 1.25 0 0 0 9.5 9.25M7.5 14c.76 1.77 2.5 3 4.5 3s3.74-1.23 4.5-3zM3 12c0 .82.5 1.53 1.21 1.84C4.07 13.25 4 12.63 4 12s.07-1.25.21-1.84C3.5 10.47 3 11.18 3 12m18 0c0-.82-.5-1.53-1.21-1.84c.14.59.21 1.21.21 1.84s-.07 1.25-.21 1.84C20.5 13.53 21 12.82 21 12"/></svg>
React
import type { SVGProps } from "react";
export function MdiBabyFace(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M1 12c0-1.81 1.2-3.34 2.86-3.83A8.97 8.97 0 0 1 12 3a9 9 0 0 1 8.15 5.17C21.8 8.66 23 10.19 23 12s-1.2 3.34-2.85 3.83A9 9 0 0 1 12 21c-3.6 0-6.71-2.11-8.14-5.17A3.99 3.99 0 0 1 1 12m13.5-2.75a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25a1.25 1.25 0 0 0-1.25-1.25m-5 0a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25A1.25 1.25 0 0 0 9.5 9.25M7.5 14c.76 1.77 2.5 3 4.5 3s3.74-1.23 4.5-3zM3 12c0 .82.5 1.53 1.21 1.84C4.07 13.25 4 12.63 4 12s.07-1.25.21-1.84C3.5 10.47 3 11.18 3 12m18 0c0-.82-.5-1.53-1.21-1.84c.14.59.21 1.21.21 1.84s-.07 1.25-.21 1.84C20.5 13.53 21 12.82 21 12"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M1 12c0-1.81 1.2-3.34 2.86-3.83A8.97 8.97 0 0 1 12 3a9 9 0 0 1 8.15 5.17C21.8 8.66 23 10.19 23 12s-1.2 3.34-2.85 3.83A9 9 0 0 1 12 21c-3.6 0-6.71-2.11-8.14-5.17A3.99 3.99 0 0 1 1 12m13.5-2.75a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25a1.25 1.25 0 0 0-1.25-1.25m-5 0a1.25 1.25 0 0 0-1.25 1.25a1.25 1.25 0 0 0 1.25 1.25a1.25 1.25 0 0 0 1.25-1.25A1.25 1.25 0 0 0 9.5 9.25M7.5 14c.76 1.77 2.5 3 4.5 3s3.74-1.23 4.5-3zM3 12c0 .82.5 1.53 1.21 1.84C4.07 13.25 4 12.63 4 12s.07-1.25.21-1.84C3.5 10.47 3 11.18 3 12m18 0c0-.82-.5-1.53-1.21-1.84c.14.59.21 1.21.21 1.84s-.07 1.25-.21 1.84C20.5 13.53 21 12.82 21 12"/></svg> </template>
CSS
.icon-baby-face {
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%22currentColor%22%20d%3D%22M1%2012c0-1.81%201.2-3.34%202.86-3.83A8.97%208.97%200%200%201%2012%203a9%209%200%200%201%208.15%205.17C21.8%208.66%2023%2010.19%2023%2012s-1.2%203.34-2.85%203.83A9%209%200%200%201%2012%2021c-3.6%200-6.71-2.11-8.14-5.17A3.99%203.99%200%200%201%201%2012m13.5-2.75a1.25%201.25%200%200%200-1.25%201.25a1.25%201.25%200%200%200%201.25%201.25a1.25%201.25%200%200%200%201.25-1.25a1.25%201.25%200%200%200-1.25-1.25m-5%200a1.25%201.25%200%200%200-1.25%201.25a1.25%201.25%200%200%200%201.25%201.25a1.25%201.25%200%200%200%201.25-1.25A1.25%201.25%200%200%200%209.5%209.25M7.5%2014c.76%201.77%202.5%203%204.5%203s3.74-1.23%204.5-3zM3%2012c0%20.82.5%201.53%201.21%201.84C4.07%2013.25%204%2012.63%204%2012s.07-1.25.21-1.84C3.5%2010.47%203%2011.18%203%2012m18%200c0-.82-.5-1.53-1.21-1.84c.14.59.21%201.21.21%201.84s-.07%201.25-.21%201.84C20.5%2013.53%2021%2012.82%2021%2012%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%22currentColor%22%20d%3D%22M1%2012c0-1.81%201.2-3.34%202.86-3.83A8.97%208.97%200%200%201%2012%203a9%209%200%200%201%208.15%205.17C21.8%208.66%2023%2010.19%2023%2012s-1.2%203.34-2.85%203.83A9%209%200%200%201%2012%2021c-3.6%200-6.71-2.11-8.14-5.17A3.99%203.99%200%200%201%201%2012m13.5-2.75a1.25%201.25%200%200%200-1.25%201.25a1.25%201.25%200%200%200%201.25%201.25a1.25%201.25%200%200%200%201.25-1.25a1.25%201.25%200%200%200-1.25-1.25m-5%200a1.25%201.25%200%200%200-1.25%201.25a1.25%201.25%200%200%200%201.25%201.25a1.25%201.25%200%200%200%201.25-1.25A1.25%201.25%200%200%200%209.5%209.25M7.5%2014c.76%201.77%202.5%203%204.5%203s3.74-1.23%204.5-3zM3%2012c0%20.82.5%201.53%201.21%201.84C4.07%2013.25%204%2012.63%204%2012s.07-1.25.21-1.84C3.5%2010.47%203%2011.18%203%2012m18%200c0-.82-.5-1.53-1.21-1.84c.14.59.21%201.21.21%201.84s-.07%201.25-.21%201.84C20.5%2013.53%2021%2012.82%2021%2012%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/baby-face.svg?color=%231a73e8&size=48
