Annual/monthly toggle with discount
A monthly/annual segmented toggle where the annual side shows the saving.
Expected impact
Shifts mix toward annual prepay; the visible percent saved does the persuasion.
Why it works
Baremetrics: annual plans retain ~92% of customers at 12 months vs 68% for monthly, so nudging annual prepay via the toggle compounds retention.
The prototype prompt
This is the spec Growthtyping compiles for you. The {{brand.*}} tokens are replaced with colors, fonts, radii, and voice pulled from your brand — so the render comes out on-brand, not generic.
PATTERN SPEC: A billing-period toggle for the {{brand.site}} pricing page: segmented control with Monthly and Annually options, the annual side tagged with the percent saved in {{brand.success}}. Prices in a 3-plan grid below update live when toggled. Toggle uses {{brand.button_radius}} radius and 1px {{brand.border}} borders; selected state in {{brand.primary}}.Related ideas
Purchasing-power-parity banner
A dismissible geo-targeted discount bar above the pricing grid with a code chip.
Most-popular plan highlight
A 3-plan grid where the target plan is visually elevated with a badge.
Usage-based price slider
A slider over the usage metric showing the computed monthly price live.
Plan recommender quiz
Three quick questions that end on a recommended plan card with a CTA.
Turn the idea into a prototype
Start from a proven growth pattern, apply your brand, and hand your team an on-brand prototype in minutes.