Chainlit Application allows for design customization through the use of a custom CSS stylesheet. To enable this, modify your configuration settings in .chainlit/config.toml.

config.toml
[UI]
# ...
# This can either be a css file in your `public` dir or a URL
custom_css = '/public/stylesheet.css'

At the moment, we do not provide a detailed guide of all the available css classes. It is up to you to dig in the Web Inspector and find the css class you wish to override.

Once the configuration is updated, restart the application. Your custom styling will now be applied.

Was this page helpful?

ThemeCustom React Frontend