Developer mode
Opens components on the React tab by default.
Your bookmarks


Helps users understand different pricing plans to choose from.

Getting people to purchase a service requires their trust. Help earn that trust by presenting choices clearly so they can make informed decisions.

Presenting pricing information in a structured table allows users to quickly scan for differences and choose the service that’s right for them.

Component status

Web (React)
iOS (Swift)
Android (Kotlin)
Not doing

Content structure

Feature icon: helps explain the value proposition of each choice; badge: supports users in the decision process based on real data; tooltip: optionally indicates the text is wrapped with more info; name: helps users navigate through the offer and you should always use the shortest version; feature list: clearly explains differences among choices and can include custom content (usually a list); action buttons: includes equal calls-to-action without highlighting any choice; price: makes price easy to notice for the initial comparison of choices.