> ## Documentation Index
> Fetch the complete documentation index at: https://developers.pcibooking.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Stylesheets

> Customize the look and feel of PCI Booking's hosted card forms and card display pages with your own CSS

Stylesheets customize the appearance of PCI Booking's hosted forms (card capture, CVV capture, card display, and Card By Link). Upload your own CSS to match your brand. PCI Booking applies the stylesheet when rendering the form.

## How It Works

1. **Create a stylesheet** with your custom CSS rules.
2. **Give it a unique name** that you will reference in your API requests.
3. **Reference the stylesheet name** when generating a card entry or display form. PCI Booking renders the form with your styles applied.

If no stylesheet is specified, PCI Booking applies default styling.

## Managing Stylesheets via the Portal

1. Log into the [PCI Booking portal](https://users.pcibooking.net).
2. Navigate to **GUI Settings** > **Stylesheet Settings**.
3. Click the plus icon to create a new stylesheet.
4. Provide:
   * **Resource name** - a unique name used to reference this stylesheet in API requests.
   * **Resource description** - a free-text description for your reference.
   * **Resource Content LTR** - CSS rules for left-to-right page layouts.
   * **Resource Content RTL** - CSS rules for right-to-left page layouts (e.g. Arabic, Hebrew).

## Managing Stylesheets via the API

<Warning>
  The user performing API actions must have the `System Configurator` permission. If you are unsure, check with your account administrator or [contact our support team](mailto:support@pcibooking.net).
</Warning>

You can also manage stylesheets programmatically:

| Operation      | API Reference                                                     | Description                                          |
| -------------- | ----------------------------------------------------------------- | ---------------------------------------------------- |
| **Add/Update** | [Add or Update CSS](/api-reference/general/add-update-css)        | Create a new stylesheet or overwrite an existing one |
| **List**       | [List CSS Records](/api-reference/general/list-css-records)       | Retrieve all stylesheets in your account             |
| **Retrieve**   | [Retrieve CSS Record](/api-reference/general/retrieve-css-record) | Get the content of a specific stylesheet             |
| **Delete**     | [Delete CSS Record](/api-reference/general/delete-css-record)     | Remove a stylesheet                                  |

<Info>
  When updating a stylesheet via the API, the new content overwrites the existing content entirely.
</Info>

## Next Steps

<CardGroup cols={2}>
  <Card title="Hosted Card Entry Form" icon="book" href="/capture-cards/hosted-card-entry-form">
    Card capture form that uses stylesheets
  </Card>

  <Card title="Card Display" icon="book" href="/use-tokens/card-display">
    Card display form that uses stylesheets
  </Card>

  <Card title="Custom Translations" icon="book" href="/account-setup/custom-translations">
    Customize form text and labels
  </Card>
</CardGroup>
