Logo design guidelines

A properly formatted and cropped logo emphasizes an agents’s credibility and can increase engagement with users. A badly displayed logo lowers trust in an agent more than no branding at all. Because of how strongly a logo can affect users' perceptions and willingness to use an agent, it's important that your logo displays well.

In conversations, logos are cropped to display as circles. Because images are defined as rectangles, you need to check that your logo crops to a circle well. You don't need to account for the thickness of the border that displays around logos. The border doesn't overlap the logo image.

Verified SMS conversation

Do

Leave sufficient space in your image to account for cropping.

Verified SMS logo
Well spaced logo
Verified SMS logo
Logo in mock cropped well with callouts
Verified SMS logo
Well spaced logo in cropping circle
Verified SMS logo
Logo in mock cropped well

Space your logo equidistant from all sides of the image to make sure it displays properly and fully.

Verified SMS logo
Logo with equal measurements from image borders
Verified SMS logo
Logo with equal measurements from image borders in cropping circle

Don't

When a logo takes up the entire height and width of the image, parts of the logo often get cropped out. The result is an unbalanced, badly cropped icon prone to credibility issues.

Verified SMS logo
Badly formatted logo
Verified SMS logo
Badly cropped logo in mock
Verified SMS logo
Badly formatted logo in cropping circle

Proceed with caution

Logos don't update when dark mode is enabled. Unless your logo has sufficient contrast and recognizability on both white and black backgrounds, avoid images with transparencies. Logos without sufficent contrast bend into dark mode backgrounds and suffer reduced visibility. If a transparent background doesn't suit your logo, use a white background.

Verified SMS conversation
Logo with transparent background in dark mode
Verified SMS conversation
Logo with white background in dark mode

Resources

Use the following resources to help you design your logo or troubleshoot issues.

Logo template

Use the circle logo template as a base for agent logos you create.

Download[PNG]   [SVG]

Logo preview tool

Enter a URL for your logo to see how it would display in a conversation with users.