Skip to main content

​
Custom CSS

For web designers and advanced developers who require pixel-perfect control over the AI agent widget, ZynfoAI provides a robust Custom CSS Tab within the Agent Management dashboard.

​
Overriding Default UI Styles

You can write raw cascading style sheets (CSS) directly into this tab. The styles you write here will be securely injected into the widget, allowing you to override our default layout, animations, fonts, and box-shadows.

​
Example Customization Use Cases

  • Typography Integration: Importing a custom Google Font to match your website’s typography exactly.
  • Shape Modification: Changing the shape of the AI agent launcher button from a standard circle to a custom rounded rectangle.
  • Advanced Theming: Adding complex gradient backgrounds or glassmorphism effects to the chat header.
Note: Always use the live preview window to safely test your CSS classes before saving to production. If you accidentally break the layout, simply delete your custom CSS code and save to instantly restore the default styling.