“As seen in” and “trusted by” strips are conversion gold — they borrow credibility from brands your visitors already know. An infinite logo carousel loops your brand logos seamlessly forever, with zero JavaScript and zero apps. It’s the single most professional-looking 20 lines of CSS you’ll ever add.

Here are 6 carousel styles, all looping live below. The trick is simple: duplicate the logo row and animate it translateX(-50%) for a perfect seamless loop. Copy any style into a Custom Liquid section.

1. Fashion – Minimal Brand Strip

Clean, quiet luxury: brand names in spaced-out serif on white, gliding past at a calm pace. No boxes, no borders — just names, floating. This is how fashion multi-brand stores signal curation without clutter. The 22-second loop is slow enough to read each name, fast enough to feel alive.

Preview

Watch the brands glide by ☝️ — seamless infinite loop.

Liquid Code

<div class="lk-lc1">
  <div class="lk-lc1-track"><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">VELVET&CO</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">NORDWIND</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">LUMIÈRE</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">ATLAS</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">MONO</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">VELVET&CO</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">NORDWIND</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">LUMIÈRE</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">ATLAS</span><span style="font-family:Georgia,serif;font-size:22px;letter-spacing:3px;color:#555">MONO</span></div>
</div>
<style>
.lk-lc1{overflow:hidden;background:#ffffff;padding:26px 0;border-radius:12px}
.lk-lc1-track{display:flex;align-items:center;gap:64px;width:max-content;animation:lk-lc1Scroll 22s linear infinite;}
.lk-lc1-track>*{white-space:nowrap;}
@keyframes lk-lc1Scroll{to{transform:translateX(-50%)}}
</style>

2. Beauty – Soft Logo Cards

Each logo sits in its own soft pill-shaped card on blush — like partner badges at a beauty expo. The cards give structure to varied logo shapes and make the strip feel designed rather than pasted. Perfect for ‘our ingredients partners’ or ‘as featured in’ press logos on cosmetics stores.

Preview

Soft logo cards floating past ☝️.

Liquid Code

<div class="lk-lc2">
  <div class="lk-lc2-track"><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">GLOSSIER</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">SEPHORA</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">VOGUE</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">ELLE</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">BYRDIE</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">GLOSSIER</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">SEPHORA</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">VOGUE</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">ELLE</span><span style="background:#fff;padding:12px 28px;border-radius:40px;font-weight:700;color:#9d4e5c;box-shadow:0 3px 12px rgba(0,0,0,.06)">BYRDIE</span></div>
</div>
<style>
.lk-lc2{overflow:hidden;background:#fdf5f2;padding:26px 0;border-radius:12px}
.lk-lc2-track{display:flex;align-items:center;gap:64px;width:max-content;animation:lk-lc2Scroll 22s linear infinite;}
.lk-lc2-track>*{white-space:nowrap;}
@keyframes lk-lc2Scroll{to{transform:translateX(-50%)}}
</style>

3. Electronics – Dark Tech Ticker

A Bloomberg-style ticker for tech: glowing cyan brand names streaming across near-black. It feels like live market data — urgent, current, high-tech. Use it for ‘compatible with’ brand strips (Apple, Samsung, Sony…) on accessory stores. The monospace type sells the terminal aesthetic.

Preview

Tech ticker streaming live ☝️ — fast and electric.

Liquid Code

<div class="lk-lc3">
  <div class="lk-lc3-track"><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">SONY</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">BOSE</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">JBL</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">ANKER</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">LOGITECH</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">SONY</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">BOSE</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">JBL</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">ANKER</span><span style="font-family:'Courier New',monospace;font-weight:700;color:#00ffcc;font-size:20px">LOGITECH</span></div>
</div>
<style>
.lk-lc3{overflow:hidden;background:#07070d;padding:26px 0;border-radius:12px}
.lk-lc3-track{display:flex;align-items:center;gap:64px;width:max-content;animation:lk-lc3Scroll 14s linear infinite;}
.lk-lc3-track>*{white-space:nowrap;}
@keyframes lk-lc3Scroll{to{transform:translateX(-50%)}}
</style>

4. Food – Playful Badge Row

Round badges with emoji-free typographic logos bouncing gently as they scroll — fun without being childish. The warm cream background and chunky type feel like a farmers’ market banner that never ends. Great for ‘our suppliers’ or ‘stocked at’ strips on food and beverage stores.

Preview

Badge row rolling by ☝️ — fresh and playful.

Liquid Code

<div class="lk-lc4">
  <div class="lk-lc4-track"><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">FRESH</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">ORGANIC</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">LOCAL</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">VEGAN</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">RAW</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">FRESH</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">ORGANIC</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">LOCAL</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">VEGAN</span><span style="background:#fff;border:3px solid #f59e0b;border-radius:50%;width:86px;height:86px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#b45309">RAW</span></div>
</div>
<style>
.lk-lc4{overflow:hidden;background:#fff8e7;padding:26px 0;border-radius:12px}
.lk-lc4-track{display:flex;align-items:center;gap:64px;width:max-content;animation:lk-lc4Scroll 22s linear infinite;}
.lk-lc4-track>*{white-space:nowrap;}
@keyframes lk-lc4Scroll{to{transform:translateX(-50%)}}
</style>

5. Fitness – Bold Sponsor Wall

Heavy condensed type on black with red accents — this strip looks like the sponsor wall at a fight night. The aggressive styling tells visitors your brand plays in the big leagues. Use it for athlete sponsors, gym partners, or ‘fuelled by’ supplement brand logos. Intimidating in the best way.

Preview

Sponsor wall marching past ☝️ — pure power.

Liquid Code

<div class="lk-lc5">
  <div class="lk-lc5-track"><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">ROGUE <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">NIKE <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">GNC <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">UNDER ARMOUR <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">REEBOK <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">ROGUE <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">NIKE <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">GNC <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">UNDER ARMOUR <span style="color:#ff3b3b">★</span></span><span style="font-weight:900;font-size:24px;letter-spacing:1px;color:#fff">REEBOK <span style="color:#ff3b3b">★</span></span></div>
</div>
<style>
.lk-lc5{overflow:hidden;background:#0c0c0c;padding:26px 0;border-radius:12px}
.lk-lc5-track{display:flex;align-items:center;gap:64px;width:max-content;animation:lk-lc5Scroll 22s linear infinite;}
.lk-lc5-track>*{white-space:nowrap;}
@keyframes lk-lc5Scroll{to{transform:translateX(-50%)}}
</style>

6. General – Grayscale Press Logos

The universal trust strip: ‘AS SEEN IN’ followed by grayscale press logos that colourise on hover. Desaturating logos looks intentional and premium (and sidesteps clashing brand colours). The hover-to-colour micro-interaction rewards curious visitors. Works for literally any store with press mentions.

Preview

Press logos drifting by ☝️ — hover one to colourise it.

Liquid Code

<div class="lk-lc6"><p class="lk-lc6-label">AS SEEN IN</p><div class="lk-lc6-track"><span>Forbes</span><span>Forbes</span><span>TechCrunch</span><span>TechCrunch</span><span>Wired</span><span>Wired</span><span>GQ</span><span>GQ</span><span>Vogue</span><span>Vogue</span></div></div>
<style>
.lk-lc6{overflow:hidden;background:#f7f7f7;padding:22px 0 28px;border-radius:12px;text-align:center}
.lk-lc6-label{font-size:12px;letter-spacing:4px;color:#999;margin:0 0 16px}
.lk-lc6-track{display:flex;align-items:center;gap:70px;width:max-content;animation:lkLc6Scroll 26s linear infinite}
.lk-lc6-track span{font-family:Georgia,serif;font-size:24px;color:#bbb;white-space:nowrap;filter:grayscale(1);transition:color .3s, filter .3s}
.lk-lc6-track span:hover{color:#111;filter:none}
@keyframes lkLc6Scroll{to{transform:translateX(-50%)}}
</style>

How to Add Infinite Logo Carousel to Shopify

1. From your Shopify admin, go to Online Store → Themes.
2. Click Customize on your live (published) theme.
3. In the theme editor sidebar, click Add section → Custom Liquid.
4. Copy the code from any variation above and paste it into the Custom Liquid box.
5. Drag the section where you want it on the homepage and click Save — done! No app needed.

Customize the Infinite Logo Carousel

• Replace the brand names with your own — or swap text for <img> logo images (keep heights equal, e.g. height:40px).
• Change the speed: edit the seconds in animation:... 22s linear infinite — lower is faster.
• The seamless loop needs the logo row duplicated exactly once — don’t add or remove items from only one half.
• Add pause on hover with .your-prefix:hover .your-prefix-track{animation-play-state:paused}.
• For reverse direction, use animation-direction:reverse on the track.

More Shopify Code Sections

• Shopify Scrolling Brand Logos Section
• Shopify Liquid Announcement Bar with Scrolling Text
• Shopify Dual-Line Marquee Effect
• Shopify Hero Banner Text Animation (Liquid + CSS)
• Shopify Animated Counter Section
• Shopify Testimonial Auto Slider
• Shopify Infinite Logo Carousel (No App)
• Shopify Image Hover Zoom Effect

Conclusion

An infinite logo carousel is pure CSS doing the work of a $10/month app — borrowed trust, endless motion, zero JavaScript. Duplicate your logo row, animate it to -50%, and you’ve got a strip that never stops building credibility. Pick the style that matches your brand’s volume level, drop it into Custom Liquid, and let the logos do the talking.

Want more copy-paste Shopify sections like this? Check out LayoutKart’s premium Shopify templates — professionally designed themes packed with conversion-boosting sections, ready to launch in minutes.