# Online store branding: look like a brand, not a listing

[Canonical HTML page](https://gradiently.design/guide/dropshipping-store-branding)

If your products could be bought from ten other shops, the brand is the only thing that is yours. Here is how to build one in five decisions, and how to keep every ad and product page inside it.

## The short version

- Online store branding comes down to five decisions: a name and wordmark, a colour system, a product background, a type pair and a consistent ad style.
- Shops that sell the same products as competitors depend on branding more than most, because the brand is the only thing a customer cannot find elsewhere.
- A small colour system of one ground colour, one accent and one neutral is easier to keep consistent than a large palette.
- Putting every product on the same background is the fastest way to make a store look like a brand rather than a set of supplier photos.
- Ads, product images and social posts should share the same colours, type and background so a customer recognises the shop wherever they see it.

**Online store branding** is what makes a shopper trust your shop enough to buy, and remember it enough to come back. For most stores it comes down to five decisions: a name with a simple wordmark, a small colour system, one background that every product sits on, a pair of typefaces, and ads that follow the same rules. Shops that sell products also available elsewhere, such as dropshipping and print on demand stores, need this most, because the brand is the only part a competitor cannot copy from the same supplier.

## Why online stores look like listings

A listing is a product with a price. A brand is a point of view about who the product is for. Stores look like listings when they use the supplier's photos on white, a free theme in its default colours, a logo made from a stock icon and ads that change style every week. None of those choices is wrong alone. Together they say "nobody made decisions here", and shoppers notice, even if they couldn't explain it.

### Looks like a listing

- Supplier photos on plain white
- Theme's default blue buttons
- A stock icon next to the shop name
- Every ad in a different template
- Product titles stuffed with keywords

### Looks like a brand

- Every product on one signature background
- Buttons and links in your accent colour
- A clean wordmark in a chosen typeface
- Ads that share one layout and ground
- Product names a person would say aloud

## Step 1: choose a store name and wordmark

A new store rarely needs a symbol. A wordmark, the shop name set well in one typeface, is clearer, easier to read at favicon size and harder to get wrong. Choose a typeface with some character, set the name in it, adjust the spacing between letters by eye, and stop there. [Wordmark design](https://gradiently.design/guide/wordmark-design) covers spacing and weight; [logo design basics](https://gradiently.design/guide/logo-design-basics) explains when a symbol is worth adding later.

## Step 2: pick brand colours you can keep

Large palettes fall apart within a month. Three roles are enough for a store: a **ground** that most backgrounds use, an **accent** for buttons, prices and sale badges, and a **neutral** for body text. Pick the accent with contrast in mind, because it will sit behind button labels. [How to choose brand colors](https://gradiently.design/guide/how-to-choose-brand-colors) goes through the reasoning.

- Pine ground: #1b2a24
- Oat neutral: #e9e2d4
- Clay accent: #d9773b
- Moss support: #3f6b57
- Ink text: #14110f

An example store palette for a home goods shop: a deep ground, a warm neutral, one accent for buttons and badges, a supporting green and near black for text.

- Pine to clay: `linear-gradient(160deg, #1b2a24 0%, #3f6b57 60%, #d9773b 100%)`
- Oat studio: `radial-gradient(circle at 30% 20%, #f4efe6 0%, #e9e2d4 45%, #c9b99d 100%)`
- Warm oat fade: `linear-gradient(180deg, #e9e2d4 0%, #d9773b 140%)`

The same palette as backgrounds: a dark hero, a soft studio ground for product shots and a pale fade for banners. Copy any of them.

## Step 3: use one background for every product

This is the decision that changes a store fastest. Put every product, whether photographed or cut out, on the same ground: a coloured paper, a soft gradient, a textured surface. The grid of products immediately looks curated, and your images stop matching the competitor selling the same item. Cut out each product as a transparent PNG once, then place it on your ground. [Product photo backgrounds](https://gradiently.design/guide/product-photo-backgrounds) shows options for different kinds of product.

| Image | Size | Background |
| --- | --- | --- |
| Shopify product image | 2048×2048 px | Your studio ground, product centred |
| Shopify hero banner | 1920×1080 px | Your dark or bold ground, one line |
| Etsy listing photo | 2700×2025 px | Studio ground, product in use |
| Instagram post | 1080×1350 px | Same ground as the product page |
| Story ad | 1080×1920 px | Same ground, words in the middle |

Sizes from each platform's recommended uploads. Keep the product in the centre of square images: themes crop them for grids.

## Step 4: choose two typefaces

One typeface for headlines and the wordmark, one for everything else. A characterful serif with a plain sans works for most shops; two sans serifs of very different weights also works. Use the same pair on the site, in ads and on packaging inserts. [Font pairing](https://gradiently.design/guide/font-pairing) lists combinations that hold up.

## Step 5: make ads that match the store

A shopper who taps an ad and lands on a page in different colours wonders whether they are in the right place. Ads should use the store's ground, type and accent so the click feels continuous. Test different products and headlines, not different visual identities. [Instagram ad design](https://gradiently.design/guide/instagram-ad-design) and [Facebook ad design](https://gradiently.design/guide/facebook-ad-design) cover the formats.

A portrait ad for linen bedding on a warm gradient, with a single benefit headline

The feed ad: the store's ground, the headline font and one benefit.

The same linen bedding ad laid out as a vertical story with matching gradient and type

The story ad: the same words and ground, laid out for 9:16.

1. **Write the rules down** One page: wordmark, colours with hex codes, fonts, the product background. A [brand style guide](https://gradiently.design/guide/brand-style-guide) can be that short.
2. **Redo the top ten products first** Your best sellers are seen most. Put them on the new background before anything else.
3. **Update the theme colours** Buttons, links and sale badges in the accent; text in the neutral.
4. **Rebuild your running ads** Same products, new consistent look. Retire anything that breaks the rules.

Gradiently's brand kit can hold these rules for you: logos, palettes, a heading and body font, your voice and audience. It can read your store's website to fill in the name, colour and icon to start. Designs sit on a Mark, a gradient background that only you can export with once you claim it, so your product posts and ads cannot match anyone else's.

## FAQ

### How do I brand a dropshipping store?

Build a wordmark, a three colour system and a single product background, then replace supplier photos with your products on that background. Keep ads in the same colours and type so the store looks like one brand.

### Does an online store need a logo?

It needs a recognisable name mark. A well set wordmark is usually enough for a new store, and it reads better at small sizes than a detailed symbol.

### How many brand colours should an online shop have?

Three working roles cover most stores: a ground, an accent for buttons and prices, and a neutral for text. One or two supporting shades are fine if you use them consistently.

### What background should product photos have?

The same one for every product. A consistent coloured or textured ground makes a catalogue look curated and sets your images apart from other sellers of the same item.