> For the complete documentation index, see [llms.txt](https://docs.shipped.club/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.shipped.club/components/pricing.md).

# Pricing

Use this component to show the subscription plans of your product.

<figure><img src="https://3985976695-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT3t4pDs63s3Soj1JetJw%2Fuploads%2F5WdknkQrqVDHzqKkXjsX%2Fpricing.png?alt=media&amp;token=79dae28a-4120-4743-8fc9-7c12bfadf6aa" alt=""><figcaption><p>Pricing plans</p></figcaption></figure>

The component is called `<Pricing />` and defined in `src/components/Pricing.tsx`&#x20;

To configure the subscription plans, open `src/config/pricing.constants.ts` and set the plan title, monthly and annual price, the checkout URLs (take them from LemonSqueezy), and features.

Component: `<Pricing />`\
File: `src/components/Pricing/Pricing.tsx`

{% code title="page.tsx" %}

```typescript
import { Pricing } from "@/components/Pricing/Pricing";
```

{% endcode %}

***

{% hint style="info" %}
If you need basic components like buttons, inputs, etc, they are all available with [ChakraUI](https://chakra-ui.com/).
{% endhint %}