# Design and branding

> Change your booking page colours, logo, icon, theme, header banner and social links so it looks like your venue, not a generic form.

Who can do this: admins only.

Everything lives under [Booking page](/go/admin/appearance), grouped into **Layout**, **Brand** and **Links**, with a live preview. Changes apply to your [booking page](/docs/what-is-session), [home-screen app](/docs/install-as-an-app) and [booking poster](/docs/share-your-booking-page#print-a-qr-poster). For calendar versus list, see [calendar and list layout](/docs/booking-page-layout).

<Screenshot
  shot="admin-branding"
  alt="The Booking page editor in Session, showing the Brand group with logo, icon, header banner and colour controls beside a live preview of the booking page."
  caption="Booking page - colours, logo, header banner and social links, with a live preview of the booking page."
  mat="peach"
/>

## Add your logo and icon

Your logo appears in your booking page header. The icon shows in the browser tab and is the app icon on a home screen.

<Steps>
  <Step>In the **Brand** group, under **Logo**, upload a square image of at least 160x160px. Drag it to position it inside the circle and use **Zoom** to size it.</Step>
  <Step>Under **Icon**, upload a square image - 512x512px works best.</Step>
  <Step>Select **Save changes**.</Step>
</Steps>

You can upload JPEG, PNG, WebP, AVIF and GIF images, up to 4.5MB each.

<Callout variant="tip">
If your logo has a transparent background, you can set a background colour while positioning it. On a home screen, your brand colour shows through transparent parts of the icon. If the icon is too small to look sharp, your logo is used instead.
</Callout>

Without a logo, your venue name shows as text in the header on desktop.

## Choose a theme

The theme is the first setting in the **Brand** group and applies to every visitor - customers can't switch it.

- **Default** - a colour you choose with the **Page background** picker.
- **Light** - a white page.
- **Dark** - a dark page with readable text.

## Set your brand colour

The brand colour is used for buttons, links and accents. **Button text** is the colour of words on top of them, like "Book now".

<Steps>
  <Step>In the **Brand** group, set the **Primary colour** with the picker or a hex value like `#C94F2E`.</Step>
  <Step>Set **Button text** - usually white (`#ffffff`) for a dark brand colour, or a dark colour for a light one - and select **Save changes**.</Step>
</Steps>

"Brand colour" also heads the colour options for [sessions](/docs/repeat-schedules) and [locations](/docs/locations). New sessions start on it and follow your changes.

If your brand colour is so pale that text in it would be invisible, Session darkens it for links and prices only. Buttons, the banner and session tiles always use your exact colour.

## Set your header banner

The header banner is the strip across the top of your booking page, behind your logo. In the **Brand** group under **Header banner**, choose **Image** and upload a photo (drag to position it vertically), or choose **Colour** and pick one. Select **Save changes**. Switching to a colour keeps your uploaded image, so you can flip back.

## Your default session image

An image you added at [signup](/docs/account-setup) prefills every new session, and fills your members, bundles and gift voucher pages when they have no image of their own. It never overwrites a session's own photo. To change it, message us from **Help & support** in the admin sidebar.

## Position a session image

Session photos are cropped from the centre to fit the session page, featured cards, confirmation emails and the [sessions block](/docs/email-marketing#add-your-sessions-without-retyping-them) of marketing emails. To keep a subject in view, open the session's **Details** section, drag the image in the **Image** field, and select **Save**. Every place the photo appears re-crops around that point. Uploading a new photo resets it to the centre.

## Add your website and social links

In the **Links** group:

- **Homepage** adds a Home link to your header.
- **Social links** for Instagram and Facebook show as header icons.
- **Short name** (optional, up to 12 characters) labels your home-screen app.

You don't need `https://` - Session adds it. The **Booking URL** is also here; read [Your booking links](/docs/booking-links) before changing it.

## Common questions

1. **Why don't my changes show up?** Make sure you selected **Save changes**. Installed home-screen apps can take up to a day to update.

2. **My logo doesn't fill the circle - can I make it bigger?** Yes. Drag the **Zoom** slider up while positioning it. Past 100% it crops rather than stretches, so it won't distort.

3. **Why was my iPhone photo rejected?** iPhones save photos as HEIC, which browsers can't display. Set **Settings → Camera → Formats** to **Most Compatible**, or for an existing photo, choose **Share → Options → Most Compatible** in Photos.

4. **Does repositioning a session image change my other sessions?** No. The position is saved on that session only. Duplicating a session copies its position along with the photo.