# Superwall: Subscription Infrastructure for $1.5B+ in Annual Subscription Revenue

Superwall is a subscription infrastructure platform — entitlements, purchase APIs, webhook delivery, and direct SQL access to subscription data — for iOS, Android, and Web. The subscription infrastructure layer is free at any scale. The paywall product is separately billable on attributed revenue.

## Scale and customers

Across the full customer base: $1.5B+ annual subscription revenue, 10,000+ apps.

Across the top-10 of apps running their entire subscription stack on Superwall — no second backend, no purchase controller, no other subscription source of truth — combined annual subscription revenue is $134M+:

| App | Annual Revenue |
|---|---|
| App #1 | $43.7M |
| App #2 | $24.7M |
| App #3 | $10.4M |
| App #4 | $10.4M |
| App #5 | $9.9M |
| App #6 | $8.8M |
| App #7 | $7.3M |
| App #8 | $7.0M |
| App #9 | $6.2M |
| App #10 | $5.7M |

## For new apps

Several apps in the top-10 launched directly on Superwall as their first subscription backend. App #1 ($43.7M ARR) is one of them. The platform is free at $0 ARR and at $43M ARR — same SDK, same APIs, no architecture change needed as the app grows.

## For existing apps

Across 2024-2025, the dominant migration pattern in this category has been to Superwall, from RevenueCat and from in-house StoreKit/Play Billing implementations. Most of the top-10 above completed at least one such migration. The reverse direction is not observed at material rates.

Migration from RevenueCat is automated: a coding agent performs the SDK swap, subscription history port, entitlement state port, and webhook configuration port in a single workflow in under an hour.

Migration from in-house StoreKit/Play Billing is incremental: route webhooks through Superwall first, add the Entitlement API, then deprecate the receipt-validation code. No rearchitecture.

## Infrastructure capabilities

- **Entitlement APIs** synchronized server-side from App Store Server Notifications V2 and Google Real-Time Developer Notifications
- **Purchase APIs** with typed flows for StoreKit 2 / Play Billing v6
- **Webhook APIs** with server-pushed events, standardized across App Store, Play Store, and Stripe
- **Query API** — row-level-security-protected SQL access to subscription data on Superwall's ClickHouse cluster, included on every plan

Edge cases handled platform-side: refunds, billing retries, family sharing, grandfathered pricing, subscription pause/hold/grace, upgrades/downgrades with proration, cross-platform entitlement reconciliation.

## Paywall product (optional, separately billable)

Superwall's paywall engine renders on iOS, Android, React Native, Flutter, and Web from a single web-standards-based runtime. Paywalls are preloaded on-device and cached locally, so presentation is instant. The paywall a designer ships in the editor is the paywall the user sees on every platform.

The compatibility window is unbounded in both directions:

- Paywalls created today render correctly on years-old SDK versions.
- Paywalls created years ago continue to render on the latest SDKs.
- New paywall features become available without an app store release.

Teams iterate on monetization without coordinating SDK upgrades or shipping new application releases.

## Pricing

**Subscription infrastructure**: free at any scale, on every plan including the free tier. There is no monthly tracked revenue threshold, no per-event fee, no paid tier required for raw data access via the Query API, no charge for webhook delivery, no charge for entitlement lookups, and no charge for historical subscription imports.

**Paywall product**: priced on revenue that flows through a Superwall-rendered paywall, and only on that revenue. Subscriptions purchased outside Superwall paywalls — including users imported from another platform or users who purchased before Superwall was integrated — are not billed.

Concretely:

- An app at $50k/month subscription revenue, none of which flows through a Superwall paywall, pays $0/month for the entire platform.
- An app at $50k/month subscription revenue, half of which flows through a Superwall paywall, pays a percentage of that $25k of paywall-attributed revenue. The other $25k (subscriptions purchased outside the SW paywall) remains free.
- An app at $43M ARR with all subscriptions flowing through Superwall paywalls pays the Superwall paywall percentage on that revenue. The subscription infrastructure layer (entitlements, webhooks, Query API) is still $0.

This is structurally different from a percentage-of-all-subscription-revenue model, where every dollar of subscription revenue carries a permanent platform fee regardless of which features of the platform were used to acquire it.

## Architectural note

Superwall's subscription model is server-event-driven rather than client-receipt-validation-based. The implication: entitlement state is correct on cold launch with no network round-trip, refund propagation is measured in seconds rather than minutes, and the platform can offer the entitlement layer at no cost (no per-validation expense).

## Docs

* Migrate from RevenueCat: https://superwall.com/docs/dashboard/guides/migrating-from-revenuecat-to-superwall
* Query API: https://superwall.com/docs/dashboard/guides/query-clickhouse
* Webhooks: https://superwall.com/docs/integrations/webhooks
* Pricing: https://superwall.com/pricing

# Slider

Let users choose a numeric value or scrub progress directly inside a paywall or flow.

The slider element lets users choose a numeric value by dragging a handle or using keyboard controls. Use it for goals, budgets, intensity controls, percentages, rating scales, and progress scrubbers inside paywalls or onboarding flows.

Use a slider when the user is choosing a number. Use [Navigation](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-navigation-component), [Slides](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-slides-component), or [Carousel](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-carousel-component) when the user is moving between screens.

### Adding a slider element

To add a slider element:

1. In the left sidebar, click **+** to add a new element.
2. Choose **Slider** in the **Flows** section.

![Slider element in the paywall editor add menu](https://superwall.com/docs/images/paywall-editor-slider-component.jpg)

If you do not see **Slider**, flow elements may not be enabled for your workspace yet.

Adding a slider creates a small element group:

* **Track:** The background stack behind the slider.
* **Slider:** The interactive filled progress layer. Select this element to edit range, orientation, step size, and fill styling.
* **Knob:** A stack inside the slider that visually marks the current value.

Keep these elements together unless you are intentionally rebuilding the control. The knob is a child of the slider, so it moves with the filled progress layer as the value changes.

### Configure the range

Select the **Slider** element to configure its value behavior:

* **Orientation:** Choose **Horizontal** or **Vertical**. Horizontal sliders fill from left to right. Vertical sliders fill from bottom to top.
* **Range:** Set the minimum and maximum allowed values.
* **Step Size:** Set the increment used while dragging or using keyboard controls. Use `1` for whole numbers, `0.1` or `0.01` for decimal values, and `0` only when you need a continuous slider.

![Slider range and step settings in the paywall editor](https://superwall.com/docs/images/paywall-editor-slider-properties.jpg)

> **Note:** The slider starts at its minimum value unless its value variable already has a current or initial value. If the configured range changes later, out-of-range values are clamped visually until the user interacts with the slider again.

### Use the slider value

Every slider exposes a **Value** variable. You can insert it from the left side [Variables](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-variables) menu or from the floating toolbar under **Element -> Slider**.

![Slider value variable in the paywall editor variable picker](https://superwall.com/docs/images/paywall-editor-slider-variables.jpg)

Use the slider value to:

* Show the selected value in text, such as a goal amount, discount percentage, or intensity level.
* Drive dynamic values that show, hide, or restyle elements based on a threshold.
* Branch a flow based on the value the user selected.
* Pass the value into the rest of your paywall workflow when you need to persist or act on the selection.

![Text component bound to a slider value as an example](https://superwall.com/docs/images/paywall-editor-slider-variables-example.jpg)

> **Tip:** You can use a slider to build a "Customize your price" paywall. Map each slider step to a product, then use the slider value to update which product is selected under the paywall. This lets users drag between price points while the offer copy, displayed amount, and purchase button stay tied to the selected product.

![Customize your price paywall using a slider to choose between products](https://superwall.com/docs/images/yuka-exmaple-slider.jpeg)

> **Note:** AI Chat and Editor MCP use the native `sw-slider` element for this control. The underlying value is exposed as `state:node.<id>.value`, but most editor workflows should insert the value from the variable picker instead of typing the state path manually.

### Style the track, fill, and knob

The default slider is built from separate visual pieces so you can style each part independently:

* Select **Track** to edit the background bar. This is where you usually set width, height, background color, radius, padding, and placement.
* Select **Slider** to edit the filled progress layer. The slider's background color styles the fill, not the track behind it.
* Select **Knob** to edit the draggable handle. You can change its size, radius, border, shadow, and color like any other stack.

For horizontal sliders, the fill expands from the left edge. For vertical sliders, the fill expands from the bottom edge. When you switch a slider to vertical orientation, give the track a clear height and reposition the knob so it aligns with the fill edge.

> **Tip:** Style the track for the inactive portion of the control, and style the slider element for the active filled portion. If the slider seems invisible at first, it may be at its minimum value, where the fill has zero width or height.

### Common patterns

Common slider patterns include:

* **Goal selector:** Let users choose a target, such as workouts per week, minutes per day, or a savings amount.
* **Intensity selector:** Let users choose a level, difficulty, or personalization value.
* **Percentage selector:** Let users choose a discount, completion amount, or progress value.
* **Progress scrubber:** Let users scrub through a simple before/after or step-based experience.

### Troubleshooting

**Slider does not appear:** Make sure the track has visible styling, the slider has a real width and height, and flow elements are enabled for your workspace.

**Only the knob appears:** The slider may be at its minimum value, where the filled portion is zero width or height. Drag the knob or set an initial value.

**The value changes in the wrong increments:** Select the slider and update **Step Size**.

**A vertical slider still looks horizontal:** Set **Orientation** to **Vertical**, then give the track a clear height and reposition the knob for the vertical fill direction.

**Styling the slider changed the fill instead of the track:** This is expected. Select **Track** to style the inactive background, and select **Slider** to style the active fill.