> ## Documentation Index
> Fetch the complete documentation index at: https://docs.fetchski-attract.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Logos / Partners

> Show partner, client or certification logos as a scrolling strip or a grid.

The **Logos / Partners** section shows a row of logos: the partners you work with, clients you serve, or certifications you hold. Show them as a slow scrolling strip or as a calm grid.

 **Who can do this:** anyone who can edit the page. The **CSS** tab is for Admins and Owners.

![A Logos strip as visitors see it: eyebrow "Trusted by", heading "In good company", and a scrolling row of six partner logos in grayscale, one logo in full color under the pointer.](https://mintcdn.com/fetchski-attract-api/QcMtbPjPXDGpHtJh/images/cms/guides/sections/logos/guides-sections-logos-overview-light.png?fit=max\&auto=format\&n=QcMtbPjPXDGpHtJh\&q=85\&s=072b96d367656a603ba96a87953943ef)

A scrolling strip of logos, in color when you point at one.

## When to use it

* To show the brands, partners or suppliers you work with.
* To show certifications, awards or memberships that build trust.
* To show "as seen in" press logos near the top of your home page.

## Add it to a page

**1. Open the page**

Sign in, open the page on your site, and choose **Edit** in the edit bar at the top.

**2. Find the spot**

Select the section next to where the new one should go. A round **+** button appears on its top and bottom edges. On an empty page, choose **Add Content** in the middle.

**3. Choose the section**

The **Add Content** menu opens with its groups. Choose the section, then select it and choose **Edit** in its side toolbar to make it yours.

For the full walkthrough, see [Add, move and remove sections](https://docs.fetchski-attract.com/guides/build-pages/add-move-remove-sections.md).

Choose **Add Content** → **Content** → **Logos / Partners**. The section starts with no logos and shows nothing until you add one, so add your logos right away. To add, reorder or remove logos, see [Lists of items](https://docs.fetchski-attract.com/guides/sections/what-every-section-shares.md#lists-of-items).

![The Add Content menu open on the Content group, with the Logos / Partners tile ringed.](https://mintcdn.com/fetchski-attract-api/QcMtbPjPXDGpHtJh/images/cms/guides/sections/logos/guides-sections-logos-add-menu-light.png?fit=max\&auto=format\&n=QcMtbPjPXDGpHtJh\&q=85\&s=df2fd03820c70263db9949e420dfd85d)

Logos / Partners lives in the Content group.

## What you can change

Select the section on the page and choose **Edit**. The editor opens beside the page, so you see each change as you make it. It has five tabs: **Logos**, **Background**, **Fonts**, **Button** and **CSS**.

Your changes go into the page's draft. Visitors see them once the page is published with **Update** in the edit bar (**Publish** on a page never published).

![The Logos editor open on the Logos tab, scrolled to the Logos list with one logo open (Logo, Name, Link (optional), Invert on dark theme ringed).](https://mintcdn.com/fetchski-attract-api/QcMtbPjPXDGpHtJh/images/cms/guides/sections/logos/guides-sections-logos-editor-light.png?fit=max\&auto=format\&n=QcMtbPjPXDGpHtJh\&q=85\&s=c60c52b87d0e3e65aa4b16f645766369)

Each logo has an image, a name and an optional link.

> [accordion] Logos
>
> Everything about the header, the way logos are shown, and the logos themselves.
>
> **Header**
>
> * **Show eyebrow** and **Eyebrow**: a small line above the heading, "Trusted by" to start. Choose its weight and size too.
> * **Heading**: "In good company" to start. Leave it empty to hide the heading. To show just the logos, also turn off **Show eyebrow** and clear the intro line.
> * **Intro line**: an optional short sentence under the heading.
> * **Header alignment**: **Center** or **Left**. With only a few logos in a grid, the grid follows it too.
>
> **Display**
>
> * **Display**: **Marquee (scrolling)** moves the logos slowly across the screen in a loop. **Static grid** sets them in still rows.
> * **Marquee speed**: **Slow**, **Normal** or **Fast**.
> * **Marquee direction**: **Right to left** or **Left to right**.
> * **Show pause button on background motion**: adds a pause button so visitors can stop the strip.
> * **Logos per row**: for a grid only. **Auto (fit to width)** works for any number of logos, or lock 3 to 6 per row.
>
> **Look**
>
> * **Gap between logos**: **Tight**, **Normal** or **Roomy**.
> * **Logo size**: **Small**, **Medium** or **Large**. It sets the height, and each logo keeps its own shape.
> * **Show each logo on a tile**: sets every logo on a raised card with a border.
> * **Grayscale until hover**: shows the logos in muted gray, and in full color when a visitor points at one. It's on to start.
>
> **Logos** (one row per logo)
>
> * **Logo**: choose the image from your Images library. It's required. A logo with no solid background behind it works best, so the section's color shows around it. Ask whoever made your logo for an SVG file (it stays sharp at any size) or a PNG with a transparent background.
> * **Name**: the partner's name, such as "Portland Pet Supply". It's required, and screen readers read it aloud.
> * **Link (optional)**: makes the logo a link, for example to the partner's website. Links to other websites open in a new tab.
> * **Invert on dark theme**: for a black or dark logo that would disappear on the dark theme. It turns the logo light in the dark theme only.
>
> The header and heading colors can each be set separately for the dark and light themes. Leave them empty to use your site's colors.

> [accordion] Background
>
> A background color for the whole section, set separately for the dark and light themes. It starts as **Transparent (page background)**. See [What every section shares](https://docs.fetchski-attract.com/guides/sections/what-every-section-shares.md).

> [accordion] Fonts
>
> Use a different typeface for parts of this section only, such as the heading. Leave it empty to use the page's fonts, which normally come from **Site design** → **Typography**. See [What every section shares](https://docs.fetchski-attract.com/guides/sections/what-every-section-shares.md).

> [accordion] Button
>
> One optional button under the logos, such as "See all our partners". It uses your site's outline button look, with an arrow after the label. It shows only when it has both a **Button label** and a **Button link**. To learn every button option, see [Buttons and card styles](https://docs.fetchski-attract.com/guides/site-design/buttons-and-card-styles.md).

> [accordion] CSS
>
> Custom styles for this section only. Admins and Owners can change this tab. See [Custom CSS](https://docs.fetchski-attract.com/guides/site-design/custom-css.md).

## Looks you can make

![A static grid of eight logos, four per row, each on a raised tile, in full color, with the header left-aligned.](https://mintcdn.com/fetchski-attract-api/Nd5MQAxOTNHgiQxt/images/cms/guides/sections/logos/guides-sections-logos-tiled-grid-light.png?fit=max\&auto=format\&n=Nd5MQAxOTNHgiQxt\&q=85\&s=b7e0887cf8b0647738e2d45c965fe11a)

A tidy grid of logos on tiles.

**A certification wall.** Set **Display** to **Static grid**, choose **4 per row**, turn on **Show each logo on a tile**, and turn off **Grayscale until hover**.

![The same black partner logo twice in the dark theme: on the left invisible against the dark background, on the right turned light with Invert on dark theme.](https://mintcdn.com/fetchski-attract-api/Nd5MQAxOTNHgiQxt/images/cms/guides/sections/logos/guides-sections-logos-invert-dark.png?fit=max\&auto=format\&n=Nd5MQAxOTNHgiQxt\&q=85\&s=5bbc587df7796810c7751242e3c9614e)

Invert on dark theme keeps a black logo visible.

**Dark logos that stay visible.** For each black or dark logo, turn on **Invert on dark theme**.

![A slim, slow strip of small logos with no eyebrow or heading, on a Sunken background band, with the pause button under the strip at its right end.](https://mintcdn.com/fetchski-attract-api/QcMtbPjPXDGpHtJh/images/cms/guides/sections/logos/guides-sections-logos-quiet-strip-light.png?fit=max\&auto=format\&n=QcMtbPjPXDGpHtJh\&q=85\&s=3aebf45627bd45261bfbdf94be335971)

A quiet strip of logos with a pause button.

**A quiet "as seen in" strip.** Turn off the eyebrow, clear the heading, and set **Logo size** to **Small** and **Marquee speed** to **Slow**.

## Good to know

* **Moving logos.** If you use the scrolling strip, turn on the pause button so visitors can stop it.
* **The strip moves while you edit too.** In the editor it scrolls at a set pace. Visitors see the **Marquee speed** you chose. Visitors who prefer less motion see the logos still, and the pause button hides itself.
* **Write each logo's name.** It's what screen readers say for the logo, so use the partner's real name.
* **Where it fits.** Logos is a full-width band for pages. It isn't offered inside a **Layout** column or in a blog post's body.

## Appearance options

Most sections also share a few tabs that work the same everywhere:

* **Background**: set the color behind the section, separately for the dark and light themes.
* **Fonts**: use a different typeface for parts of this section only.
* **CSS**: add custom styles to this section. Admins and Owners can change it.

See [What every section shares](https://docs.fetchski-attract.com/guides/sections/what-every-section-shares.md) for every option.

## Related

> [card] [Testimonials](https://docs.fetchski-attract.com/guides/sections/testimonials.md)
>
> let your customers speak for you.

> [card] [Stats / By the numbers](https://docs.fetchski-attract.com/guides/sections/stats.md)
>
> back up your claims with numbers.

> [card] [The media library](https://docs.fetchski-attract.com/guides/media/media-library.md)
>
> upload your logo images.

> [card] [Motion](https://docs.fetchski-attract.com/guides/site-design/motion.md)
>
> turn site animations on or off.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.