🎉 Introducing Softalon Payments: Get paid online with 0% commission, from day one.

Softalon

  1. 1.Before you start
  2. 2.Set colors and style
  3. 3.Open the theme settings
  4. 4.Pick a color scheme
  5. 5.Pick a color mode
  6. 6.Pick a corner style
  7. 7.Save
  8. 8.Upload your logo
  9. 9.Set your app name and icons
  10. 10.Remove Softalon branding
  11. 11.Common questions
Guide

Change your site's colors, logo and icon

Pick your booking site's color scheme, light or dark mode and corner style, upload your logo, and set the name and icons for the installable web app.

4 min readRole: Super Administrator or higherBooking websiteUpdated October 25, 2026
Open in the app

The Theme page sets the look of your whole booking site: colors, light or dark mode, rounded corners, your logo, and how the site appears when clients add it to their home screen.

Before you start

  • You need the Super Administrator or Owner role.
  • Have your logo ready as a JPEG or PNG file, up to 10 MB.

Set colors and style

  1. 1

    Step 1 of 5

    Open the theme settings

    Go to Settings › Appearance › Theme and find the Color & Style card.

  2. 2

    Step 2 of 5

    Pick a color scheme

    Under Color Scheme, choose Neutral, Red, Rose, Orange, Green, Blue, Yellow or Violet. To match your brand exactly, choose Custom and pick your own color. The scheme colors your buttons, links and highlights.

  3. 3

    Step 3 of 5

    Pick a color mode

    Under Color Mode, choose:

    • Automatic to follow each visitor's device setting,
    • Light to always show a light site, or
    • Dark to always show a dark site.
  4. 4

    Step 4 of 5

    Pick a corner style

    Under Border Radius, choose None, Small, Medium or Large for how rounded buttons and cards look.

  5. 5

    Step 5 of 5

    Save

    Click Save at the bottom of the card.

    You will see:

    A Settings Updated message appears. Reload your booking site to see the new look.

  1. In the Logo card, upload a JPEG or PNG image, up to 10 MB.
  2. Click Save.

Your logo appears in your site's header and footer. To choose whether the header shows the logo, your salon name, or both, see Edit your site's header and footer. If you haven't uploaded a logo, the header shows your salon name instead.

Set your app name and icons

Clients can add your booking site to their phone's home screen, where it opens like an app. The App Identity card controls how it looks there and in browser tabs.

FieldWhat it's forFile
App NameThe full name of the app, for example Hair Haven Austin. It's also used as your site's title and in link previews.—
Short NameA shorter name for places with little space, such as under the home screen icon.—
DescriptionA short description of your salon.—
FaviconThe small icon in the browser tab. Best at 32x32 px.JPEG, PNG or SVG, up to 1 MB
Small IconThe home screen icon and other small spots. Best at 192x192 px.JPEG or PNG, up to 10 MB
Large IconSplash screens and larger displays. Best at 512x512 px.JPEG or PNG, up to 10 MB

Fill in the fields and click Save. If you leave App Name empty, your salon name is used.

Use a square icon with some space around your logo. Phones may crop the corners of home screen icons into a circle or rounded square.

Remove Softalon branding

The Remove Branding card at the bottom of the page hides the Powered by Softalon line on your site. It's available on the Ultimate plan. See Remove Softalon branding.

Common questions

With Automatic, your site follows each visitor's device setting. With Light or Dark, everyone sees the mode you chose.

Was this useful?

Related guides

Edit your site's header and footerChange your booking site's header layout, logo display, menu links and announcement bar, and arrange the blocks in your footer.Remove Softalon brandingHide the Powered by Softalon line from your booking site, booking flow and live chat.Add the salon to your home screenPut the salon's website on your phone's home screen so it opens like an app, with the salon's name and icon.
PreviousChange booking steps and contact fieldsNextEdit your site's header and footer