Appearance Settings

🎨 Appearance Settings #

This section allows you to customize the look and feel of the subscription popup and messages to match your brand style.

1. Popup Background Color
   Pick a background color for the popup container using the color picker.
   Example: #2b2f3e

2. Popup Close Button Color
   Sets the color of the popup’s close (×) button.
   Example: #ffffff (white)

3. Popup Overlay Color
   This is the color of the screen overlay behind the popup (the dimmed background).
   Example: #2e3865

4. Popup Terms and Condition Text Color
   Choose the color for any text related to terms and conditions in the popup.

5. Popup Header Text Color
   Sets the color of the main header text of the popup.

6. Popup Overlay Opacity
   Controls how transparent or dark the overlay is.
   Value ranges from 0 (fully transparent) to 1 (fully opaque).
   Example: 0.8

7. Submit Button Text
   Change the text shown on the form submission button.
   Example: “SUBSCRIBE”

8. Submit Button Color
   Select the color of the submit button’s background.
   Example: #21b990

9. Submit Button Hover Color
   Sets the background color when a user hovers over the submit button.
   Example: #21b990

10. Submit Button Text Color
    Pick a color for the text on the submit button.
    Example: #2b2f3e

11. Success Message Text Color
    The text color shown after a user successfully submits the form.
    Example: #21b990

12. Success Message Background Color
    Background color of the success message area.
    Example: #ffffff

13. Error Message Text Color
    Color of the error text (e.g., for invalid email or required field error).
    Example: #de0b0b (red)

14. Error Message Background Color
    Background color of the error message.
    Example: #ffffff

15. Form Width (in px)
    Set the overall width of the popup form in pixels.
    Example: 500

16. Form Alignment
    Choose where to align the popup form content:

    • Left

    • Center

    • Right

17. Success Message
    Customize the success message that appears after a successful subscription.
    You can also use the {COUPONCODE} variable to include the generated discount code.