How to add custom CSS to notifications

You can add custom CSS to any notification to match your hotel’s branding or adjust the design beyond the built-in options.

Steps

Change the button color:

.tinybell-button {
    background-color: #1a1a2e;
    border-radius: 25px;
}

Change the font:

.tinybell-notification {
    font-family: 'Georgia', serif;
}

Make the notification wider:

.tinybell-modal {
    max-width: 600px;
}

Custom CSS overrides TinyBell’s default styles. Test your changes on both desktop and mobile before going live.

⌘I