# Plan components

> Present pricing or features clearly using 3 plan components, optimized for React and styled with Tailwind CSS.

37 components available. Showing all of them below.

- [Plan Tool](https://21st.dev/@serafimcloud/components/plan-tool.md) — by Serafim
- [Plan Tool](https://21st.dev/@serafimcloud/components/plan-tool/pending-update.md) — by Serafim
- [Plan Tool](https://21st.dev/@serafimcloud/components/plan-tool/approved.md) — by Serafim
- [Pricing](https://21st.dev/@Codehagen/components/pricing.md) — by Prism UI
- [Dialog](https://21st.dev/@originui/components/dialog/payment-plan-dialog.md) — by Origin UI
- [Pricing Interaction](https://21st.dev/@ln-dev7/components/pricing-interaction.md) — by LN
- [Pricing Table](https://21st.dev/@kokonutd/components/pricing-table.md) — by Kokonut Baffier
- [Modal Pricing](https://21st.dev/@kokonutd/components/modal-pricing.md) — by Kokonut Baffier
- [Pricing Card](https://21st.dev/@bankkroll/components/pricing-card.md) — by Bankk
- [Select](https://21st.dev/@originui/components/select/select-with-description-and-right-indicator.md) — by Origin UI
- [Pricing Container](https://21st.dev/@anurag-mishra22/components/pricing-container.md) — by Anurag Mishra
- [Radio Group](https://21st.dev/@originui/components/radio-group/plans.md) — by Origin UI
- [Princing Section](https://21st.dev/@rlzee/components/pricing.md) — by R'LZ
- [PricnigCards03](https://21st.dev/@ruixen.ui/components/pricnig-cards03.md) — by Ruixen UI
- [Bubble Button](https://21st.dev/@ravikatiyar162/components/bubble-button.md) — by Ravi Katiyar
- [Radio Group with Plan Cards](https://21st.dev/@shadcnspace/components/radio-group-with-plan-cards.md) — by ShadcnSpace
- [Radio Group 1](https://21st.dev/@ShadcnStudio/components/radio-group-1/radio-group-thirtheen.md) — by ShadcnStudio
- [Login Card](https://21st.dev/@arihantcodes_1f7b8c4d/components/login-card-1/subscription-plan-card.md) — by Arihant jain
- [Radio Group 1](https://21st.dev/@ShadcnStudio/components/radio-group-1/radio-group-ten.md) — by ShadcnStudio
- [Radio Group 1](https://21st.dev/@ShadcnStudio/components/radio-group-1/radio-group-twelve.md) — by ShadcnStudio
- [Radio Group 1](https://21st.dev/@ShadcnStudio/components/radio-group-1/radio-group-eleven.md) — by ShadcnStudio
- [Radio Group 1](https://21st.dev/@ShadcnStudio/components/radio-group-1/radio-group-seven.md) — by ShadcnStudio
- [Checkbox](https://21st.dev/@anubra266/components/checkbox-1/cards-checkbox.md) — by Abraham
- [Radio Group](https://21st.dev/@anubra266/components/radio-group/radio-group-plans.md) — by Abraham
- [Pricing for Teams](https://21st.dev/@dhileepkumargm/components/pricing-for-teams.md) — by Dhileep Kumar GM
- [Flexnative Select](https://21st.dev/@felipemenezes098/components/flexnative-select/with-object.md) — by felipemenezes098
- [Dialog](https://21st.dev/@anubra266/components/dialog-2/choose-subscription.md) — by Abraham
- [Feature Comparison Table](https://21st.dev/@7ovr/components/comparison-3.md) — by 7Ovr
- [HeroUI Radio Group](https://21st.dev/@hero_ui/components/heroui-radio-group.md) — by Hero Ui
- [Pricing Section](https://21st.dev/@mikolajdobrucki/components/pricing.md) — by Mikolaj Dobrucki
- [Usage Slider Plan Selector](https://21st.dev/@felipemenezes098/components/select-a-plan-4.md) — by felipemenezes098
- [Startup Pricing Plans](https://21st.dev/@shadcnspace/components/pricing-01.md) — by ShadcnSpace
- [HeroUI Radio Group](https://21st.dev/@hero_ui/components/heroui-radio-group/in-surface.md) — by Hero Ui
- [HeroUI Radio Group](https://21st.dev/@hero_ui/components/heroui-radio-group/disabled.md) — by Hero Ui
- [HeroUI Radio Group](https://21st.dev/@hero_ui/components/heroui-radio-group/horizontal-orientation.md) — by Hero Ui
- [Pricing Section 1](https://21st.dev/@shadcnstore/components/pricing-section-1.md) — by ShadcnStore
- [Billing Upgrade Prompt](https://21st.dev/@preetsuthar17/components/billing-upgrade-prompt.md) — by Preet Suthar

Full component directory: https://21st.dev/llms.txt