All Collections
For Admins | Web Widgets
How do I change the design of my web widgets?
How do I change the design of my web widgets?

As an admin, learn how to customize the design of your embeddable user onboarding and drop-in booking widgets

Keith Whitby avatar
Written by Keith Whitby
Updated over a week ago

Under Settings > Web Widgets, you can set up user onboarding and drop-in booking widgets that can be embedded directly onto your website.

To customize the look and feel of these widgets, head to Settings > Web Widgets > Widgets overview > Customize Theme.

On this Theme page you have a number of properties that can be customized to ensure the experience reflects your organization's branding:

  • Choose a theme - Allows you to select from a templated theme. You can use this as a starting point and then make further customizations.

  • Background - Sets the background color.

  • Dark mode - Enabling dark mode will switch the font color from dark to light so that it displays better on dark background colors.

  • Accent - Use this to set the color for the buttons and navigation indicator.

  • Button text - Use this to choose if you want light or dark text on buttons within the widget.

  • Nav bar - Use this to set the colour of the header and footer bars.

  • Nav bar text - Use this to choose if you want light or dark text on the header.

  • Font - Select your organization's font or check out Google Fonts to find one that works for you.

  • Text field style - Adjust this to change how the input fields are displayed.

  • Navigation bar shadow - Use this to add or change a shadow under the main navigation bar/header.

  • Button corners - Adjust this to make the corners of buttons more round or more square.

  • Button shadows - Enable the toggle to turn on shadows under the widget buttons.


Need more info on Settings?

Did this answer your question?