¿Cómo puedo cambiar mi color de icono sin relleno en el interior?

Estoy tratando de conseguir mi icono como este:

Sin embargo, se ve como:

Este es mi código:

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        style="@style/FAB"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_baseline_favorite_border_24"/>

<style name="FAB" parent="Widget.Design.FloatingActionButton">
    <item name="shapeAppearanceOverlay">@style/FABShape</item>
    <item name="android:backgroundTint">@color/black</item>
    <item name="android:tint">@color/yellow</item>
</style>

<style name="FABShape" parent="ShapeAppearance.MaterialComponents.SmallComponent">
    <item name="cornerSize">10%</item>
</style>

Este es el vector de la forma de corazón (de Google):

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24"
    android:tint="?attr/colorControlNormal">
  <path
      android:fillColor="@android:color/white"
      android:pathData="M16.5,3c-1.74,0 -3.41,0.81 -4.5,2.09C10.91,3.81 9.24,3 7.5,3 4.42,3 2,5.42 2,8.5c0,3.78 3.4,6.86 8.55,11.54L12,21.35l1.45,-1.32C18.6,15.36 22,12.28 22,8.5 22,5.42 19.58,3 16.5,3zM12.1,18.55l-0.1,0.1 -0.1,-0.1C7.14,14.24 4,11.39 4,8.5 4,6.5 5.5,5 7.5,5c1.54,0 3.04,0.99 3.57,2.36h1.87C13.46,5.99 14.96,5 16.5,5c2,0 3.5,1.5 3.5,3.5 0,2.89 -3.14,5.74 -7.9,10.05z"/>
</vector>

Estoy esperando el vector de ser un vacío en forma de corazón. Pero cuando me aplique un tinte de color, es el colorido que en el interior. ¿Hay alguna manera de conseguir el matiz de color que sólo se aplican a la parte exterior de la forma del corazón?