Shadcn client logo sections for SaaS
SaaS client logo strips do trust-signal work that no other section can. Five to eight recognizable logos directly under the hero clear the first trust threshold ('real companies use this') and qualify the visitor to keep scrolling. Putting logos in the footer instead is the most common SaaS landing page mistake — by the time visitors scroll to the footer, they've already decided. Logos belong above the fold-fold, not at the page bottom.
npx shadcn@latest add https://ruixen.com/r/trusted-clients-showcase
For Tailwind v3 or Base UI, swap the URL prefix — see /tailwind-v3-shadcn or /base-ui-shadcn.
Why this differs for saas
Logo selection matters more than logo count. Five logos visitors actually recognize beat fifteen logos they don't. If you have one or two big-name customers, use those alone in a 'Trusted by' callout instead of forcing them into a strip with smaller customers. The logo strip works as a recognition test — visitors scan, find a name they know, and that single recognition does more conversion work than the rest of the strip combined.
Recommended components
Curated picks from the Ruixen registry that fit this use case. Click through to the canonical component docs for code, previews, and props.
Shadcn client logos section — Spotlight logo grid with staggered blur-up entrance and collective dim hover — logos sit quiet at 40% opacity until you hover.
Shadcn client logos section — Dual ribbon with grayscale bloom — two rows of logos scroll in opposite directions at offset speeds, monochrome at rest, color.
Shadcn client logos section — a 5-column wordmark grid with subtle dividers, hover-tinted cells, and decorative cross markers at the four corners. Pure.
Shadcn client logos section — Proximity ribbon marquee — logos drift continuously, pause on hover, and respond to cursor proximity with a smoothstep gaussian.
Frequently asked questions
How many client logos should a SaaS landing page show?
Five to eight in a static strip; 12+ if you're using a marquee/auto-scrolling pattern. Fewer than five looks thin; more than eight in a static row creates visual clutter and visitors stop perceiving each logo individually. The sweet spot is six logos, evenly-spaced, sized so each has equivalent visual weight — disparate logo sizes (where one is 3x the others) create accidental hierarchy that distracts from the trust signal.
Should we use grayscale logos or color logos?
Grayscale, almost always. Color logos turn into a visual chaos band — Slack purple next to Stripe purple next to Salesforce blue creates a rainbow that competes with your headline above. Grayscale logos read as a unified strip, signal restraint, and let your brand colors keep their emphasis. The exception: if your brand identity is itself colorful and editorial, color logos can fit; for most B2B SaaS, grayscale is the default.
Auto-scrolling marquee or static logo strip?
Static for fewer than 12 logos; marquee for 12+ when you want to imply 'and many more'. Static reads as confident ('here are our customers, take a look'); marquee reads as scale-flexing ('look how many we have'). Don't ship a marquee with only 6 logos — the loop becomes obvious after one cycle and the section reads as smaller than it is. Match the format to the inventory: enough logos to fill a marquee, or commit to static.
Browse all client logos
The Client Logos category page has every Ruixen client logos variant — not just the curated picks for saas.
See all client logos →