---
title: "Design"
slug: "darstellung-1"
updated: 2025-07-07T14:41:08Z
published: 2025-07-07T14:41:08Z
canonical: "help.frisbii.com/darstellung-1"
---

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

# Design

## Preliminary Remarks

For an individual layout, basic settings regarding color and font can be made here. However, these are optional.

By default, **black** is used as the color.

Several display variants can be created, but only one of them can be active at any one time.

---

## Editing the checkout display

### Create new design variant

- Click on **+ Add Design Variant**. The editing mode opens.
- Enter an **Internal Title**.
- Click on the **Default** checkbox to **activate/deactivate** the display variant.
- Click on the checkboxes to **activate** and **edit** the color.

![](https://cdn.document360.io/b84e1b5d-2ba6-4465-8c62-fb45a2f31314/Images/Documentation/5dd6f6aa-0d2d-45aa-8090-2090add9cf0d)

**Background color:** Specifies the background color in the checkout.

**Primary color:** Specifies the fill color of the buttons (e.g. *Register, Purchase*).

**Secondary color:** Specifies an alternative color.

**Font:** Defines the font for the checkout.

**Font color:** Specifies the font color.

**Color for link texts:** Specifies the color for links (e.g. *Redeem voucher, Register now*).

- **Adjustments CSS**
- **Adjustments Javascript**

A custom CSS or Javascript can be added for the checkout process. The system does not minimize these.

To provide minimized CSS or Javascript, these must be minimized.

> [!TIP]
> **Note**: *Frisbii Media* will no longer support in case of problems with the layout if a custom CSS or Javascript is used.

## Manage the Checkout Variants

### Edit Checkout Variant

1. Search for the desired variant in the list.
2. Click on **Commands** > **Edit** .
3. The editing mode opens.

### Delete Design Variant

There are two ways to delete a variant:

1. in the detail view
2. in edit mode

- Click on **Delete variant**.

> [!TIP]
> **Note:**
> 
> - The active design variant **cannot** be deleted.
> - If a variant is deleted, the action **cannot** be undone!