> For the complete documentation index, see [llms.txt](https://developer.paddle.com/llms.txt).

# Build pricing pages with Paddle.js

Build pricing pages without making server-side calls to the Paddle API using a new method in Paddle.js.

---

## What's new?

We added a new [`Paddle.PricePreview()`](https://developer.paddle.com/paddlejs/methods/paddle-pricepreview.md) method to Paddle.js that you can use to get localized pricing for items and location information.

It's ideal [for building pricing pages](https://developer.paddle.com/build/checkout/build-pricing-page.md), and other pages in your app that present calculated totals for prices, including discounts, taxes, and currency conversion.

## How it works

You can use [the preview prices operation](https://developer.paddle.com/api-reference/pricing-preview/preview-prices.md) in the Paddle API to get pricing calculations for a list of prices given location information. It's typically used to build pricing pages, letting you present customers with localized prices in the correct currency for a country, with estimated taxes and discount calculations too.

The new [`Paddle.PricePreview()`](https://developer.paddle.com/paddlejs/methods/paddle-pricepreview.md) method lets you use Paddle.js to get a pricing preview. It accepts a parameter for a request that shares the same request body as the preview prices operation in the API, except field names must be `camelCase`. It returns a promise that contains an object that matches the response from the price preview operation, with `camelCase` field names.

This means you can build pricing pages using Paddle.js only. You don't need to make any server-side requests to the Paddle API.

{% callout type="info" %}
The `Paddle.PricePreview()` method requires [a client-side token for authentication](https://developer.paddle.com/paddlejs/client-side-tokens.md). If you're passing the older `seller` parameter to [`Paddle.Initialize()`](https://developer.paddle.com/paddlejs/methods/paddle-initialize.md), replace this with the `token` parameter.
{% /callout %}

## Examples

This example includes a request with two items where the country code is the United States.

The request is passed to [`Paddle.PricePreview()`](https://developer.paddle.com/paddlejs/methods/paddle-pricepreview.md), which returns a promise. It prints the response to the console.

<!-- This example passes items and a country code to price preview -->
```javascript
var request = {
  items: [{
      quantity: 1,
      priceId: 'pri_01gsz8ntc6z7npqqp6j4ys0w1w',
    },
    {
      quantity: 1,
      priceId: 'pri_01gsz8x8sawmvhz1pv30nge1ke',
    }
  ],
  address: {
    countryCode: 'US'
  }
}

Paddle.PricePreview(request)
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.error(error);
  });
```

## Next steps

This change is live in Paddle.js now, so you can start using [`Paddle.PricePreview()`](https://developer.paddle.com/paddlejs/methods/paddle-pricepreview.md) when you're ready. We updated our [build a pricing page tutorial](https://developer.paddle.com/build/checkout/build-pricing-page.md) and [prepped a sample page](https://codepen.io/heymcgovern/pen/VwgvgNb) that you can use to get started.

If you have an existing implementation that passes the `seller` parameter to [`Paddle.Initialize()`](https://developer.paddle.com/paddlejs/methods/paddle-initialize.md), you'll need to replace this with the `token` parameter and [a client-side token](https://developer.paddle.com/paddlejs/client-side-tokens.md).

You don't need to do anything to get the latest version of Paddle.js — we serve the latest version automatically.