# subscription-swatches

> WAI-ARIA tabs and radios that choose a selling plan.

Status: Ready (Smootify 2.0)  
URL: https://www.smootify.io/docs/astro/reference/elements/subscription-swatches  
Updated: 2026-10-21

## Where it can go

- **Inside** [`smootify-product`](https://www.smootify.io/docs/astro/reference/elements/smootify-product).
- **Must contain** `[role="tablist"]`, `[role="tab"]`, `[role="tabpanel"]`.
- **Out of place,** Smootify removes it from the page: also when the product has no selling plans.

## What it requires

Nothing beyond Smootify: it works on every plan.

## Attributes on the element

- **It reads** `auto-select-plan`, `auto-select-index`, `data-selected-group`, `data-selected-option-index`.

## Attributes inside it

| Group | Attribute name | Values |
|---|---|---|
| [Selling plans](https://www.smootify.io/docs/astro/reference/attributes/selling-plan) | `subscription-group` | 1 |
| [Loading](https://www.smootify.io/docs/astro/reference/attributes/loading) | `skeleton` | 5 |
| [Subscription choices (condition)](https://www.smootify.io/docs/astro/reference/conditions/subscription-group) | `group-condition` | 2 |

## Loading

Its code loads only on pages that have `subscription-swatches`.