Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: beat. Pick another to preview it and update the animated code:

Remix Icon · RiUserHeartFill

User Heart Fill icon

A free user heart fill icon from Remix Icon, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

Also known asperson iconprofile iconaccount iconavatar iconmember iconcustomer iconpeople iconlike icon
License
Apache License Version 2.0
Project
github.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/remix/user-heart-fill.json
components/icons/remix-user-heart-fill.tsx
import * as React from "react";

/**
 * User Heart Fill from Remix Icon (https://github.com/Remix-Design/RemixIcon), Apache License Version 2.0.
 * Via Cuelark UI: ui.cuelark.com/icons/remix/user-heart-fill. Sized in em, colored by currentColor.
 */
export function RiUserHeartFillIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M17.841 15.659L18.017 15.836L18.1945 15.659C19.0732 14.7803 20.4978 14.7803 21.3765 15.659C22.2552 16.5377 22.2552 17.9623 21.3765 18.841L18.0178 22.1997L14.659 18.841C13.7803 17.9623 13.7803 16.5377 14.659 15.659C15.5377 14.7803 16.9623 14.7803 17.841 15.659ZM12 14V22H4C4 17.6651 7.44784 14.1355 11.7508 14.0038L12 14ZM12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1Z"
      />
    </svg>
  );
}
With react-icons
import { RiUserHeartFill } from "react-icons/ri";

export function Example() {
  return <RiUserHeartFill className="size-5" />;
}
user-heart-fill.svg
<svg
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M17.841 15.659L18.017 15.836L18.1945 15.659C19.0732 14.7803 20.4978 14.7803 21.3765 15.659C22.2552 16.5377 22.2552 17.9623 21.3765 18.841L18.0178 22.1997L14.659 18.841C13.7803 17.9623 13.7803 16.5377 14.659 15.659C15.5377 14.7803 16.9623 14.7803 17.841 15.659ZM12 14V22H4C4 17.6651 7.44784 14.1355 11.7508 14.0038L12 14ZM12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1Z"
  />
</svg>
Attribution
"User Heart Fill" icon from Remix Icon (https://github.com/Remix-Design/RemixIcon), licensed under Apache License Version 2.0.

Related icons: person, profile, account, avatar