lazy="true" needed or not needed for swiper-slide when using Swiper Element (WebComponent)?

[spacecat]

In the API docs it says (https://swiperjs.com/swiper-api#lazy-loading):

Since version 9 Swiper doesn't have a specific lazy loading API, as it relies on native browser lazy loading feature. To use lazy loading, we just need to set loading="lazy" on images and add preloader element:

<div class="swiper-slide">
   <img src="path/to/picture-1.jpg" loading="lazy" />
   <div class="swiper-lazy-preloader"></div>
</div>

And in the Swiper Element (WebComponent) docs it says (https://swiperjs.com/element#lazy):

If you use lazy loading images, it requires the lazy preloader element to be added to the each slide. swiper-slide component can do this automatically by adding lazy="true" attribute:

<swiper-slide lazy="true">
   <img src="..." loading="lazy" />
</swiper-slide>

So which one is it? With or without the lazy="true" on the swiper-slide element?

Edit: After reading my own post while editing I realized I misread :D The lazy="true" is for automatically adding the preloader element. In my case I need to explicitely add it since I need to add a custom CSS class (swiper-lazy-preloader-mycolor). I could use the swiper-lazy-preloader-white class though now that I think about it.

[nolimits4web]

This attribute on Swiper slide component just adds preloaded element. If you don't need it - don't set it

[nzozor]

How to style the preload element? I cannot find any doc. I'm using swiper web component.