user heart icon
user-heart-linear from Solar by 480 Design · Linear · Users · CC-BY-4.0 Attribution required.
- Name
- user-heart-linear
- Set
- Solar
- Style
- Linear
- Category
- Users
- Viewbox
- 24×24
- License
- CC BY 4.0
5 other variants in Solar
The same icon in other sets
More users icons from Solar
user-block-bolduser-block-rounded-bolduser-bolduser-check-bolduser-check-rounded-bolduser-circle-bolduser-cross-bolduser-cross-rounded-bolduser-hand-up-bolduser-hands-bolduser-heart-rounded-bolduser-id-bolduser-minus-bolduser-minus-rounded-bolduser-plus-bolduser-plus-rounded-bolduser-rounded-bolduser-speak-bolduser-speak-rounded-boldusers-group-rounded-boldusers-group-two-rounded-bold
Use the user heart 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-width="1.5"><circle cx="10" cy="6" r="4"/><path d="M18 17.5C18 19.9853 18 22 10 22C2 22 2 19.9853 2 17.5C2 15.0147 5.58172 13 10 13C14.4183 13 18 15.0147 18 17.5Z"/><path stroke-linejoin="round" d="M16 9.69973C16 11.1121 17.2058 11.8648 18.0885 12.5385C18.4 12.7762 18.7 13 19 13C19.3 13 19.6 12.7762 19.9115 12.5385C20.7942 11.8648 22 11.1121 22 9.69973C22 8.28732 20.35 7.28567 19 8.64354C17.65 7.28567 16 8.28732 16 9.69973Z"/></g></svg>
React
import type { SVGProps } from "react";
export function SolarUserHeartLinear(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" strokeWidth="1.5"><circle cx="10" cy="6" r="4"/><path d="M18 17.5C18 19.9853 18 22 10 22C2 22 2 19.9853 2 17.5C2 15.0147 5.58172 13 10 13C14.4183 13 18 15.0147 18 17.5Z"/><path strokeLinejoin="round" d="M16 9.69973C16 11.1121 17.2058 11.8648 18.0885 12.5385C18.4 12.7762 18.7 13 19 13C19.3 13 19.6 12.7762 19.9115 12.5385C20.7942 11.8648 22 11.1121 22 9.69973C22 8.28732 20.35 7.28567 19 8.64354C17.65 7.28567 16 8.28732 16 9.69973Z"/></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-width="1.5"><circle cx="10" cy="6" r="4"/><path d="M18 17.5C18 19.9853 18 22 10 22C2 22 2 19.9853 2 17.5C2 15.0147 5.58172 13 10 13C14.4183 13 18 15.0147 18 17.5Z"/><path stroke-linejoin="round" d="M16 9.69973C16 11.1121 17.2058 11.8648 18.0885 12.5385C18.4 12.7762 18.7 13 19 13C19.3 13 19.6 12.7762 19.9115 12.5385C20.7942 11.8648 22 11.1121 22 9.69973C22 8.28732 20.35 7.28567 19 8.64354C17.65 7.28567 16 8.28732 16 9.69973Z"/></g></svg> </template>
CSS
.icon-user-heart-linear {
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-width%3D%221.5%22%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%226%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M18%2017.5C18%2019.9853%2018%2022%2010%2022C2%2022%202%2019.9853%202%2017.5C2%2015.0147%205.58172%2013%2010%2013C14.4183%2013%2018%2015.0147%2018%2017.5Z%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M16%209.69973C16%2011.1121%2017.2058%2011.8648%2018.0885%2012.5385C18.4%2012.7762%2018.7%2013%2019%2013C19.3%2013%2019.6%2012.7762%2019.9115%2012.5385C20.7942%2011.8648%2022%2011.1121%2022%209.69973C22%208.28732%2020.35%207.28567%2019%208.64354C17.65%207.28567%2016%208.28732%2016%209.69973Z%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-width%3D%221.5%22%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%226%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M18%2017.5C18%2019.9853%2018%2022%2010%2022C2%2022%202%2019.9853%202%2017.5C2%2015.0147%205.58172%2013%2010%2013C14.4183%2013%2018%2015.0147%2018%2017.5Z%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M16%209.69973C16%2011.1121%2017.2058%2011.8648%2018.0885%2012.5385C18.4%2012.7762%2018.7%2013%2019%2013C19.3%2013%2019.6%2012.7762%2019.9115%2012.5385C20.7942%2011.8648%2022%2011.1121%2022%209.69973C22%208.28732%2020.35%207.28567%2019%208.64354C17.65%207.28567%2016%208.28732%2016%209.69973Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/solar/user-heart-linear.svg?color=%231a73e8&size=48
