Como posso alterar o meu ícone de cor sem recheio dentro?

Eu estou tentando chegar a minha ícone semelhante a este:

No entanto, ele se parece com:

Este é o meu 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 é o vetor para o formato de coração (do 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>

Eu estou esperando o vetor a ser um vazio formato de coração. Mas quando eu aplicar uma tonalidade de cor, é colorir dentro. Existe uma maneira que eu possa obter a tonalidade de cor para se aplicam apenas para o lado de fora da forma do coração?