SureSwitch for Bricks Builder
SureCart
The elegantly simple price toggle for SureCart. One-time or installments, your customers decide.
Preview
5-Minute Setup
Simple setup by adding your SureCart price IDs and customizing a few options. No coding skills needed!
SureCart integration
Works directly with your SureCart product prices and checkout URLs for a seamless experience.
Custom Colors
Match your website design with customizable colors for every element of the toggle
Price Animations
Choose between fade or counting animations when switching between prices
Custom Labels
Set your own text for toggle options and time periods to match your pricing strategy
Flexible Display
Add the toggle anywhere on your product pages with automatic responsive design
One-click copy
Simple Configuration
SureCart Ready
Available attributes
data-price-one
data-price-two
Set the SureCart Price ID for the first pricing option.
Note: This must be the Price ID from SureCart, obtained from the product page.
data-url-one
data-url-two
Set the URL for the price option.
Note: Clicking the button will redirect users to this URL.
data-toggle-label-one
Example: Monthly Plan
Custom text for the first toggle label.
Note: Describes the first pricing option.
data-toggle-label-two
Example: Annual Plan
Custom text for the second toggle label.
Note: Describes the second pricing option.
data-period-label-one
Example: per month
Define the display text for the first pricing period.
Note: This text appears next to the price.
data-period-label-two
Example: per year
Define the display text for the second pricing period.
Note: This text appears next to the price.
data-toggle-color
Example: #007AFF
Customize the toggle switch color.
Note: Use any valid CSS color value.
data-price-color
Example: #F2F2F7
Customize the text color of the displayed price.
Note: Use any valid CSS color value.
data-period-color
Example: #A1A1AA
Customize the color of the period text (e.g., "per month").
Note: Use any valid CSS color value.
data-label-active-color
Example: #FFFFFF
Set the color for the active toggle label.
Note: This applies to the selected pricing option.
data-label-inactive-color
Example: #6B7280
Set the color for the inactive toggle label.
Note: This applies to the unselected pricing option.
data-animation-type
Example: fade
Set the animation type for price changes.
Note: fade or count.
Pricing
Unlimited Access. One Payment.
Pick the plan that works for you.
Price jumps to $199 Feb 21
$169
Never pay again
Library Components
Core building blocks collection with Bricks Vanilla integration
Premium Elements
74 animated components and growing
SureCart Integration
Complete e-commerce solution with powerful features

ACSS Framework
CSS framework integration
Lifetime Updates
Get all future components and features at no extra cost
Premium Support
Direct priority assistance forever
One-Click Import
Deploy components instantly
No Coding Required
Customize using simple settings and attributes
Complete Documentation
Comprehensive guides and examples included
Instant Motion
Instant animations, preconfigured for stunning visual impact
Q1 2025
Elegant Layouts
Elegant full-page layouts for easy import
Q1 2025
Core Framework
Templates adapted to this CSS framework
$99
/year
Billed annually
Library Components
Core building blocks collection with Bricks Vanilla integration
Premium Elements
74 animated components and growing
SureCart Integration
Complete e-commerce solution with powerful features

ACSS Framework
CSS framework integration
Lifetime Updates
Get all future components and features at no extra cost
Premium Support
Direct priority assistance forever
One-Click Import
Deploy components instantly
No Coding Required
Customize using simple settings and attributes
Complete Documentation
Comprehensive guides and examples included
Instant Motion
Instant animations, preconfigured for stunning visual impact
Q1 2025
Elegant Layouts
Elegant full-page layouts for easy import
Q1 2025
Core Framework
Templates adapted to this CSS framework
From Purchase to implementation — Fast & Easy
Stop building websites. Start building experiences.