ProveSource lets you fully customize the look, feel, and behavior of your notifications so they match your website’s branding and user experience.
In this guide, you’ll learn how to control fonts, colors, layout, animations, and visual effects using the Design settings
Where to find notification design settings
Open your ProveSource dashboard.
Select an existing notification or create a new one.
Go to the Customize step.
All visual styling options for your notification are managed here under Design.
Design options explained
Font Family
Choose a font for your notification's text from the dropdown menu.
We recommend using a font that matches your website to keep the notification consistent with your brand.
Notification Position
Control where the notification appears on the screen (for example, bottom-left or top-right).
This helps avoid covering important page elements.
Notification Animation
Select how the notification enters and exits the screen:
Mobile Settings
Customize how notifications behave on mobile devices:
Notification size on mobile: choose between normal size, small size, or hide notifications on mobile entirely.
Mobile position: select whether the notification appears at the top or bottom of the screen.
Title & Message Display
You can control how text elements appear:
Show Title: toggle the notification's title on or off.
Title Color: set the color of the title text.
Message Color: set the color of the main notification text.
Note: for all color settings (title, message, background, date), you can:
Enter a hex color code (for exact brand colors), or
Pick a color from the spectrum using the color picker.
This makes it easy to match your notification exactly to your brand guidelines.
Background & Visual Style
Customize the notification background:
Background Color: select the notification's background color.
Gradient Background: enable a gradient instead of a solid color.
Glass Effect: apply a translucent, frosted-glass look.
Date Display
Show Date: display how long ago the event happened.
Date Color: control the color of the date text.
Image, Initials, or Map
Decide if you want your notification to display the title and text only or if you want to add the image/initials/map option:
Rounded Corners
Adjust the corner radius of the notification (for example, 20%) to better match your site’s design:
Preview
Use the preview at the bottom-left corner to see how the notification looks as you make changes:
Tips for best results
Match your font and colors to your website for a native look.
Keep contrast high so text remains readable.