How to add custom navigation arrows in Vue Carousel 3D?

Question

Vue.js

I'm using the Vue Carousel 3D plugin to create a gallery, but I'm running into a problem that I can't change the navigation arrows. Standard arrows can be replaced with html special characters

<div id="example">
                                <carousel-3d  :controls-visible="true" :controls-visible="true" :controls-prev-html="'←'" :controls-next-html="'→'" 
                                    :controls-width="40" :controls-height="40"  
                                         :clickable="true" :perspective="200"  :display="7" :space="25"> 
                                    <slide v-for="(slide, i) in slides" :index="i">
                                      <figure>
                                         <img :src="slide.src">
                                      </figure>
                                   </slide>
 
                              </carousel-3d>
</div>

But I want to replace them with characters from Font Awesome. That is, in fact, you need to write in controls-prev-html and controls-next-html, for example, but I didn’t understand how to do it correctly so that it is displayed in the browser.

The whole code https://jsfiddle.net/f5u1dx7w/
itself site tempesv0.beget.tech