Tailwind CSS Subscription Toggle Components
Dev Design Library indexes 9 Tailwind CSS subscription toggle components from 7 open-source UI libraries, with the most coming from uselayouts, cnblocks, OpenSourceUI, sv-efferd and UI Lab. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list styles its components with Tailwind CSS utility classes. Subscription toggle components belong to the Commerce group.
Tabs 13 - Billing ToggleShadcn Space · ReactMonthly and yearly billing tabs with a savings badge and animated pricing cards.
Toggle Pricing CardsOpenSourceUI · React
Pricing Carduselayouts · ReactA focused pricing card layout with clear hierarchy.
Pricing Fourcnblocks · SvelteFour-tier pricing with toggle switch
Pricing Foursv-efferd · SvelteAn animated pricing table with monthly-yearly toggles, live number transitions, and motion badges.
Pricing ToggleUI Lab · ReactEach digit rolls to its new price on its own, and new digits grow in.
Three-tier pricingVelora UI · ReactThree plan cards with a monthly/yearly switch, a savings badge and a highlighted middle plan.
Slide Subscribeuselayouts · ReactPick a billing period, then slide to start a trial.
Pricing Twocnblocks · SvelteTwo-column pricing with monthly/yearly toggle