Customizing your branding
Your branding is the avatar, banner image, colors, and theme schedulers see when they open your scheduling links. You set it once for your username, and once for each team, and it applies to every link under that URL. You can't set different branding for each link.
To change it, go to Settings > Links > Branding, or open any link and click Booking Page Options > Branding.
Where do I change my branding?
You can open the same settings from a few places:
- Settings > Links, in the Branding section. Use the menu at the top to pick your username or one of your teams, make your changes, and click Save settings.
- In the link editor. Click Booking Page Options > Branding, click Edit branding at the top of the editor, or click the avatar. This opens a Branding settings window for the link's username or team. Click Save when you're done.
- On a team's settings page. Click Teams, then the team's name, and scroll to Branding.
- On your profile page. When you're signed in, click Branding at the top of the page.
You can change your own branding. A team's branding can be changed by its owners and admins, and by the organization's owners and admins. Team members don't see the Branding option. See team and organization roles.
What can I customize?
| Setting | What it changes |
|---|---|
| Avatar | The round photo or logo at the top of your booking page and profile page. |
| Banner Image | A wide image across the top of the link details on your booking page, and at the top of your profile page. |
| Primary Color | Buttons and the highlight on the selected day. The default is #2563eb (blue). |
| Accent Color | Highlights, like the round icons next to "Select a date & time" and "Confirm your details." The default is #facc15 (yellow). |
| Theme | Whether your pages show in light mode, dark mode, or whichever the scheduler prefers. |
Your branding applies to your booking pages and your profile page (the page at your username or team URL that lists your links). Emails and calendar invites don't use your colors, avatar, or banner.
Which branding does a team link use?
The team's. Links you create under a team use the team's avatar, banner, colors, and theme, not your personal ones. Links under your username use your personal branding.
How do I change my avatar?
- In your branding settings, click the avatar.
- Choose an image, and use the slider to zoom in.
- Click Save.
Your personal avatar is the same one as your account's avatar under Settings > Profile, so changing it in one place changes it in both. If you haven't uploaded one, SavvyCal uses your Gravatar, if you have one. A team has its own avatar.
How do I add a banner image?
- In your branding settings, click Edit banner image.
- Choose an image. Drag it to position it, and use the slider to zoom.
- If your image has transparent areas, pick a Background Color to show behind them.
- Click Save.
Banners are cropped to a 3:1 shape. For the sharpest result, use an image that's 1500 × 500 pixels. If the image is too big to upload, you'll see "File size was too large." Try a smaller image.
To take the banner down, click Edit banner image, click Remove banner, and then Save.
How do I set my colors?
Click the color swatch next to Primary Color or Accent Color to pick a color, or type a hex code like #0f766e. Then save your settings.
The text on top of each color switches between dark and white on its own, so it stays readable on light and dark colors. To go back to the original blue and yellow, click Reset to default colors.
How does the Theme setting work?
Choose one of these under Theme:
- Match user preferences shows light or dark mode based on the scheduler's device settings. If the scheduler is signed in to SavvyCal, their own theme setting is used instead.
- Always show in light mode.
- Always show in dark mode.
After someone books, the confirmation page uses the same theme as the booking page. It doesn't use your colors or banner.
Do I need to save my changes?
It depends on the setting:
- Primary Color, Accent Color, and Theme are saved when you click Save settings (or Save in the Branding settings window).
- Avatar and Banner Image are saved when you click Save in their own window.
- Hide SavvyCal branding on scheduling links is saved as soon as you turn it on or off.
Branding changes take effect right away on every link under that username or team, including links you've already shared.
How do I remove SavvyCal branding?
On the Premium plan, turn on Hide SavvyCal branding on scheduling links in your branding settings. Like the rest of your branding, it applies to every link under that username or team. On other plans, the toggle is grayed out, and people who manage billing see a link to upgrade. See plans and pricing.
Turning it on removes:
- The SavvyCal logo on your booking pages. See what schedulers see.
- "Scheduling by SavvyCal" at the bottom of your profile page and the confirmation page.
- The "Create your own booking link" prompt that schedulers who aren't signed in see on the confirmation page.
- The SavvyCal logo on your meeting polls.
- "Scheduling by SavvyCal" at the end of calendar invite descriptions.
- "Scheduling by SavvyCal" at the bottom of emails SavvyCal sends about events, such as confirmations, updates, and cancellations.
A few things it doesn't change:
- Email senders. Emails to schedulers come from notifications@savvycal.com, with the organizer's name followed by "(via SavvyCal)." To send them from your own address, see sending emails from custom email addresses.
- Your link URLs. Links stay on savvycal.com. To host them on your own domain, see custom domains and customizing the favicon for a custom domain.
Do embedded links use my branding?
Yes. Links you embed on your website show your avatar, banner, and colors, and Hide SavvyCal branding on scheduling links applies to them too. You can hide the avatar or banner on an embed with the hideAvatar and hideBanner options. The "Create your own booking link" prompt never shows in an embed.
The theme works a little differently:
- Inline embeds use your Theme setting. If it's set to Match user preferences, they show in light mode.
- Pop-ups and the floating button show in light mode, whatever your Theme setting is.
To choose the theme yourself, set the embed's theme option (or data-theme on a hyperlink) to light, dark, or os.
Can I use different colors or a different theme on one link?
Yes, by adding these to the link's URL:
| Parameter | What it does |
|---|---|
primary_color=%23 followed by a hex code | Sets the primary color. |
accent_color=%23 followed by a hex code | Sets the accent color. |
theme=light, theme=dark, or theme=os | Shows the page in light mode, dark mode, or the scheduler's device setting. |
%23 stands for the # at the start of the hex code. For example: https://savvycal.com/username/slug?primary_color=%230f766e&theme=dark. If a color isn't a valid hex code, your saved color is used.
These work on your profile page too. To hide the avatar or banner on one link, see hiding your name, photo, or banner.
Still have a question? Contact support.