The Style section in WiserNotify allows you to customize the visual appearance of your notification, including its background, borders, shadows, and overall shape. This section focuses on aligning the notification’s design with your branding and ensuring it stands out on your website.
1. Shape
- Background Color:
- Set the background color of the notification. You can either enter a color code (e.g., HEX, RGB) or select from a color palette.
- Purpose: Align the background with your website’s theme or make it pop for better visibility.
- Radius:
- Adjust the roundness of the notification’s corners using the slider.
- Low Radius: Results in sharper, square corners for a more formal look.
- High Radius: Produces rounded corners, giving a softer, modern feel.
2. Border
- Size:
- Adjust the thickness of the border using the slider. A higher value makes the border more prominent.
- Style:
- Choose from different border styles, such as:
- Solid: A continuous line (default option in the screenshot).
- Dashed: A broken, dashed line.
- Dotted: A border made of dots.
- Choose from different border styles, such as:
- Purpose: Borders can add emphasis to your notification and help it stand out against the website background.
3. Shadow
- Effect:
- Add a shadow to give your notification a 3D or elevated look.
- Purpose: Shadows help the notification stand out by creating a sense of depth.
- Horizontal & Vertical Sliders:
- Adjust the direction of the shadow:
- Horizontal: Moves the shadow left or right.
- Vertical: Moves the shadow up or down.
- Adjust the direction of the shadow:
- Shadow Intensity:
- Modify the intensity or blur of the shadow to achieve either a subtle or dramatic effect.