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

# Brands

> The brands you stock as a wall of names or logos, each linking to that brand's products.

![Brands on the storefront](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/brands.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=c6afd1eab9c9861ef105f046ad931a08)

Brands, highlighted with the demo content

## Where to find it

Home page. In the theme editor choose Home page in the page selector, then select Brands.

## How it works

* With List your brands automatically on, the section lists up to 24 of your product vendors from A to Z, each linking to a page of that vendor's products.
* Brand name style Wall shows the names as tiles in a grid: 5 per row on desktop, 3 at 900 px and narrower, 2 on phones. Chips shows them as rounded buttons.
* Logo blocks add a wall of logos above the names. A logo links to its Link, or to the brand's products when only Brand name is set.
* Logo for dark mode replaces the logo while the shopper uses dark mode. Logos are never recolored; without a dark version the same logo shows in both modes.
* A Logo block without a logo shows its Brand name as text. Logos fit inside 160 by 48 px.
* The section is hidden when the automatic list is off or finds no vendors and there are no Logo blocks. In the theme editor a note shows in its place.

![Brands in the theme editor](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/editor-brands.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=e5eb6b503a633909e789e40f142f8a16)

In the theme editor: 1 the section in the sidebar · 2 its settings · 3 the section in the preview

## Edit it

* Fill in the Vendor field on your products: the automatic list reads it.
* For logos, add a Logo block per brand (up to 24) and turn off List your brands automatically if you want logos only.
* Upload each Logo on a transparent background, about 320 px wide, and a light version as Logo for dark mode.
* Type the Brand name: screen readers read it as the logo's description.
* Edit Heading and Text, and choose Brand name style.

## Settings

| Setting | What it does |
| - | - |
| **Heading** | Text. Default: Shop by brand. |
| **Text** | Text. Default: Say what the brands you stock have in common. |

**Brand names**

| Setting | What it does |
| - | - |
| **List your brands automatically** | On or off. Shows up to 24 product vendors from A to Z, each linking to its products. Default: on. |
| **Brand name style** | Options: Wall, Chips. Default: Wall. |
| **Color scheme** | Color scheme for this area (edit the schemes in Theme settings → Colors). Default: Scheme 1. |

## Blocks

Up to 24 blocks. Add a block with **Add block** under the section in the sidebar; drag blocks to reorder them.

### Logo

| Setting | What it does |
| - | - |
| **Brand name** | Text. Used as the image description, and shown as text when there is no logo. |
| **Logo** | Image: upload one or choose from Content → Files. 320 x 120px recommended, on a transparent background. |
| **Logo for dark mode** | Image: upload one or choose from Content → Files. Optional. A light version of the logo, shown in dark mode. |
| **Link** | Link: a page, product, collection or web address. Default: the brand's products. |

> [!NOTE]
>
> On a new store every product often has the store name as its vendor, so the wall shows a single tile until vendors are filled in.


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