How to Create a Logo Carousel in Elementor

Featured image: Elementor logo carousel showing grayscale logo tiles with one in brand colour

Drag in the Logo Slider widget, add each logo as a repeater row, set slides-per-view for desktop, tablet and mobile, and turn on autoplay with loop. It’s a free widget, one of a whole family of carousel widgets, and the whole thing takes about five minutes.

The setup is easy. What isn’t easy is making twelve logos from twelve different companies look like they belong in the same row. That’s the actual problem with every logo strip, and the second half of this covers it.

Elementor logo carousel showing client logos in a horizontal sliding strip

Step 1: Add the Logo Slider widget

Search the Elementor panel for “logo slider” and drag it in. It’s part of the free Master Addons plugin, and the free-versus-Pro breakdown has the full list of what else is in that tier. The Logo Slider documentation covers every control if you want the reference version.

Logo Slider widget in the Master Addons panel for Elementor

Step 2: Add your logos

Each logo is a repeater row: image, optional link, optional title for the alt text.

Two things to do here that most people skip:

Write real alt text. “Acme Corp logo,” not “logo-1.png.” A logo strip is one of the few places where alt text carries genuine information, because the company names are the content. Screen reader users get nothing from twelve images called “image.”

Link each logo only if the destination is useful. Linking client logos to client websites sends your traffic away from a page where it was converting. Link them to your case studies instead, or don’t link them at all. A logo strip works fine as a static trust signal.

Step 3: Layout and behaviour

Carousel settings for the Elementor logo slider with autoplay, loop and slides per view

Logo strips have different defaults from image carousels, because the job is different. Nobody studies a logo. They register it in half a second.

  • Slides per view: six on desktop, four on tablet, two or three on mobile. Higher density than a photo carousel, because logos are small and the point is quantity.
  • Autoplay: on. This is the opposite of the testimonial rule. There’s nothing to read, so continuous movement costs nothing and shows more logos than a static row.
  • Speed: slower than feels right. 4000 to 6000ms. A fast logo strip reads as agitated.
  • Loop: on, and make sure you have at least twice your slides-per-view. Six-per-view needs twelve logos minimum or the wrap will visibly jump.
  • Arrows and dots: off. A logo strip isn’t something people navigate.

Set autoplay delay to 0 and the carousel becomes a continuous marquee instead of stepping slide by slide. That’s the look most modern sites use for logo strips, and the marquee guide covers the settings in detail.

Step 4: Make mismatched logos look consistent

Here’s the real problem. You have twelve logos. Four are wide wordmarks, three are square icons, two have huge internal padding baked into the PNG, and one is a tall stacked lockup. Drop them into a row at the same width and it looks like a ransom note.

Sizing by width is the mistake. A wide wordmark set to 160px wide is visually tiny; a square icon at 160px wide is enormous. They’re the same number and they look nothing alike.

Size by optical area instead. Set a fixed height for the logo container, 40 to 50px is the usual range, let the width be automatic, and then adjust individual logos up or down by a few pixels until they look balanced. Squint at the row: any logo that jumps out is too big, any that disappears is too small. Trust your eye over the numbers, because your eye is what visitors will use.

Style settings for logo carousel items in Elementor with sizing and spacing controls

Two more fixes for the same problem:

Crop the baked-in padding. Logos exported from brand kits often carry generous clear-space inside the image file. That padding is invisible and it makes the logo render smaller than its neighbours at the same height. Crop to the visible bounding box before uploading.

Use SVG where you can. Logos are vector artwork. An SVG stays sharp at any size, weighs a fraction of a PNG, and, this is the useful part, can be recoloured with CSS, which makes the grayscale treatment below trivial.

Step 5: The grayscale hover

Grayscale to colour hover effect settings for the Elementor logo carousel

Logos desaturated at rest, full colour on hover. It’s the default treatment for a reason: twelve logos in twelve brand palettes is visual chaos, and grayscale turns them into one coherent texture.

Set the resting state to grayscale with opacity around 0.6, and hover to full colour at opacity 1, with a 200 to 300ms transition. Faster than that and it flickers; slower and it feels sticky.

One case where you shouldn’t: if the logos are press mentions rather than clients, the Forbes and TechCrunch kind of strip, leave them in colour. Those logos are recognised by their colour, and desaturating them costs you the recognition you were buying.

The finished strip

Finished Elementor logo carousel rendered on the front end with client logos

Where to put it: immediately below the hero, or immediately below the primary call to action. Both positions work because both are moments where a visitor is deciding whether to trust you.

Where not to put it: the footer. A logo strip in the footer is decoration. Nobody scrolls to the footer to be convinced.

Logo strips are one of the few sections where a stock widget beats a designed one, which is why none of the twenty Widget Builder designs tries to replace it. If you do want the Pro designs for other sections, the pricing page has the tiers.

How many logos?

Eight to sixteen. Under eight and a scrolling strip draws attention to how few there are, because a static row of six looks more confident than six logos cycling. Over sixteen, nobody sees the back half, so lead with the names people will recognise.

And if you only have four clients: show four, in a static row, at a decent size. A carousel is a way of handling abundance. Using one to hide scarcity does the opposite of what you want.

Frequently asked questions

Does Elementor have a logo carousel widget?

Not in core. Neither Elementor free nor Pro includes a dedicated logo carousel, so you need an addon. The Master Addons Logo Slider is free and handles the repeater, grayscale hover, per-logo links and marquee mode.

How do I make a logo carousel scroll continuously in Elementor?

Turn on autoplay and infinite loop, then set the autoplay delay to 0. A delay of zero removes the pause on each slide, so the track moves continuously instead of stepping. Set speed to 4000 to 6000ms so it reads as calm rather than frantic.

How do I make logos the same size in a carousel?

Set a fixed container height, 40 to 50px, and let width run automatic, rather than fixing the width. Then adjust individual logos by eye, because a wide wordmark and a square icon at the same measurement look completely different sizes. Crop any baked-in padding out of the image files first.

Should logos be grayscale or full colour?

Grayscale at rest with colour on hover for client and partner logos, because it turns a dozen clashing palettes into one coherent strip. Keep press and media logos in full colour, because those are recognised by their colour and desaturating them loses the recognition.

How many logos should be in a logo carousel?

Eight to sixteen. Fewer than eight looks better as a static row than a moving strip, because scrolling draws attention to how few there are. More than sixteen means the back half is never seen, so put the recognisable names first.

Can I link each logo to a different page?

Yes, each repeater row has its own link field. Consider whether you want to, though: linking client logos to client sites sends converting traffic away. Linking them to your own case studies keeps the visitor and does more work.

Next

Photographs rather than logos? Different widget, different defaults: how to create an image carousel in Elementor. There’s also a collection of twenty named slider designs, eight of them free to import, though none is a logo strip, so for logos the Logo Slider stays the tool.

If the strip stops moving after a caching plugin update, that’s a Swiper initialisation problem and the fix is here. Everything carousel-shaped lives on the Elementor Carousel Widgets page.

Picture of Roy
Roy
I'm Roy, part of the Master Addons for Elementor team. I write the tutorials, record the videos, and keep the documentation current, so you always know how to use every feature. I also handle support, so if you hit a snag, I'm the person who helps you fix it. Real answers, from someone who uses these tools every day.

Leave a Reply

Your email address will not be published. Required fields are marked *