Small Upgrade Modal

ModalPaywallUpgrade
Back
Small Upgrade Modal
CloneView

Component Description(Generated by AI)

The Small Upgrade Modal is a user-friendly component designed to prompt users to upgrade to a premium version of a service or product. It features a clean layout with interactive elements to enhance user engagement.

Key Features

  • Responsive design suitable for various screen sizes
  • Includes an upgrade button with a clear pricing indication
  • Grid layout for displaying features and benefits
  • Easy integration with existing Webflow projects
  • Design Elements:
  • Lightbox modal style with a semi-transparent background
  • Rounded corners and shadow effects for a modern look
  • Color scheme featuring shades of blue and white for a clean aesthetic
  • Flexbox layout for alignment and spacing of elements
  • Potential Use Cases:
  • SaaS companies looking to promote premium subscriptionsE-commerce websites offering upgraded product features
  • Online services wanting to encourage users to upgrade their plans
  • Mobile applications needing a simple upgrade prompt
  • Membership sites aiming to convert free users to paid members
  • Conclusion: The Small Upgrade Modal is a versatile and visually appealing component that effectively encourages users to consider upgrading, making it a valuable addition to any Webflow project.

Related Components

More components you might find useful

Referral Link Box
View Component
Modal

Referral Link Box

The Referral Link Box is a Webflow component designed to encourage users to invite friends by sharing a unique referral link, offering bonuses for successful referrals. Key Features Includes a prominent heading and descriptive text.Interactive elements that copy referral link upon clicking.Customizable styles for branding consistency.Responsive design suitable for various devices.Live preview available at https://invite-friends-link.webflow.io/Design Elements: Modern and clean layout with rounded corners.Color scheme featuring soft blues and whites.Dashed borders for visual separation.Includes icons for enhanced visual appeal.Potential Use Cases: E-commerce websites looking to boost customer referrals.SaaS platforms wanting to incentivize user sign-ups.Affiliate marketing programs to track and reward referrals.Online communities aiming to grow their user base.Mobile apps promoting user sharing features.Conclusion: The Referral Link Box is a versatile and visually appealing component that effectively promotes user engagement through referrals, making it an excellent addition for businesses focused on growth.

Subscription Plan Retention modal
View Component
ModalCancel Plan

Subscription Plan Retention modal

This component requires Memberscript #222. Add the following attributes to your Webflow elements before use: Trigger & Modal: - `data-ms-retain="cancel-trigger"` — on the cancel button (set to `display: none` in Webflow; the script reveals it for eligible members) - `data-ms-retain="modal"` — on the modal wrapper element Modal States (script shows one at a time): - `data-ms-retain="offer"` — the offer/discount pitch container - `data-ms-retain="loading"` — the loading/spinner container - `data-ms-retain="success"` — the confirmation container - `data-ms-retain="error"` — the error message container Buttons: - `data-ms-retain="accept"` — accept/keep plan button - `data-ms-retain="decline"` — decline/cancel anyway button - `data-ms-retain="close"` — close button (supports multiple) - `data-ms-retain="retry"` — retry button inside the error state Config Attributes (on the modal wrapper element): - `ms-retain-webhook` — your Make.com webhook URL - `ms-retain-coupon` — your Stripe coupon ID - `ms-retain-plan` — *(optional)* target a specific Memberstack plan ID - `ms-retain-field` — *(optional)* JSON key for tracking, defaults to `retention_offered` - `ms-retain-max-offers` — *(optional)* lifetime max offers, defaults to `1` - `ms-retain-cooldown` — *(optional)* days before re-offering after decline, defaults to `30` - `ms-retain-return-url` — *(optional)* return URL after Stripe portal, defaults to current page - `ms-retain-display` — *(optional)* CSS display value for the modal, defaults to `flex` Key Features - Intercepts cancel clicks and shows a retention offer before the Stripe Customer Portal - Only activates for members with an active subscription (type `SUBSCRIPTION`) - Hides the cancel button entirely for members without the target plan - Reveals the cancel button for members who do have the plan - Targets a specific plan via `ms-retain-plan` or defaults to the first active subscription - Fires a Make.com webhook to apply a Stripe coupon to the existing subscription - Tracks offer history in Memberstack member JSON to prevent repeat offers - Once accepted, the offer never shows again, cancel clicks go straight to Stripe portal - Configurable max offers and cooldown period between declined offers - Four modal states managed by the script: offer, loading, success, error - Closes on backdrop click, Escape key, or close button - Falls back to Stripe Customer Portal on decline or when ineligible Potential Use Cases - SaaS sites offering a discount to members about to cancel their monthly plan - Membership communities with a "stay and save" offer before churn - Course platforms retaining annual subscribers with a temporary price reduction - Any Stripe-powered subscription site that wants to reduce voluntary cancellations

Block Access
View Component
PaywallGated Content

Block Access

The Block Access component is designed to inform users that they do not have permission to access certain features, encouraging them to upgrade their plan or log in. It provides a clear and visually appealing message for restricted access. Key Features Responsive design suitable for various screen sizes Customizable text and links for user actions Includes visual elements such as icons and images Background image support for enhanced aesthetics User-friendly layout with clear call-to-action buttons Design Elements: Flexbox layout for centering content Soft color palette with a light background and dark text Use of icons for visual appeal Rounded button styles for a modern look Consistent typography with a focus on readability Potential Use Cases: Web applications requiring user authentication Membership sites with tiered access levelsE-commerce platforms with restricted product features SaaS products needing user upgrade prompts Educational platforms with course access limitations Conclusion: The Block Access component is a versatile solution for managing user access, effectively combining functionality with an appealing design to enhance user experience.

Exit Intent Popup
View Component
Modal

Exit Intent Popup

The Exit Intent Popup is designed to engage visitors who are about to leave a website, offering them a discount to encourage them to stay. It features a visually appealing layout with countdown timers and promotional messages. Key Features Engages users with exit intent detection Includes a countdown timer for urgency Customizable design elements Responsive and mobile-friendly Design Elements: Modern and clean layoutColor scheme includes shades of blue and whiteDashed borders for a distinctive lookPotential Use Cases: E-commerce websites looking to reduce cart abandonment SaaS platforms aiming to retain potential subscribers Blogs or content sites wanting to increase newsletter sign-ups Any business that offers discounts or promotions Conclusion: The Exit Intent Popup is a versatile tool for enhancing user engagement and conversion rates, making it an essential component for various online businesses.

View All Components