Skip to main content

​
Custom Branding

Make the chat widget look like a natural part of your website by customizing colors, logo, and removing Ringyo branding. Available on Pro and Agency plans.
Custom branding is a Pro+ feature. Upgrade your plan if you’re on the Starter plan.

​
Branding Options

Navigate to Dashboard → Settings → Chat Widget → Branding to access customization.

​
Colors

SettingDescription
Primary ColorWidget header, send button, and accent color
Background ColorChat window background
Text ColorMessage text color
User Bubble ColorColor of the visitor’s message bubbles
Agent Bubble ColorColor of the agent’s message bubbles

​
Logo & Avatar

  • Widget Icon — replaces the default chat bubble icon with your logo
  • Agent Avatar — shown next to agent messages in the chat
  • Header Logo — displayed in the chat widget header
Upload images in PNG, JPG, or SVG format. Recommended size: 64×64px for avatars, 200×40px for header logos.

​
Branding Removal

Toggle Hide “Powered by Ringyo” to remove the Ringyo attribution from the widget footer.

​
Configuration

1

Upload your assets

Go to Settings → Chat Widget → Branding and upload your logo and avatar images.
2

Set your colors

Use the color picker or enter hex values to match your brand palette.
3

Preview

Use the live preview on the right side of the settings page to see changes in real time.
4

Save and deploy

Click Save. Changes are applied immediately to all pages using your embed code — no code changes needed.

​
CSS Override (Advanced)

For more granular control, you can override widget styles with CSS: 
/* Custom widget styling */
#ringyo-widget .rg-header {
  border-radius: 16px 16px 0 0;
}

#ringyo-widget .rg-message--agent {
  font-family: 'Your Brand Font', sans-serif;
}
CSS overrides may break with widget updates. Use the built-in branding options when possible.

​
Next Steps