---
title: "Card editor"
url: "https://help.productfruits.com/en/article/card-editor"
language: "en"
last_updated: "2025-11-18T14:59:15.045Z"
---

# Card editor

The card editor is WYSIWYG (what you see is what you get) with the **exception of a pre-defined Look & Feel template** and any **CSS customization**. This means you must select **Preview** to see the final visual appearance of a card.

## Customizing the visual of the card

You can customize certain visual aspects of each card **individually** in the **editor** (this overrides the Look & Feel template)**.** You can change the **color** **of the background and text**, the **padding**, or the **vertical alignment** of each section of the card.

## Sections

Each card consists of sections. Each section can contain **different types of content**, such as text, video, an adoption meter, or Typeform.

![](https://cdn-assets.productfruits.com/ab42c126-584e-497a-9006-74f9076dfc87)

You can rearrange the **Sections** by dragging and dropping to the desired area

![](https://cdn-assets.productfruits.com/e30e3774-08c3-48b2-9fd9-875020b2eeb7)

A **Header** and **Footer** can be added to each card

![](https://cdn-assets.productfruits.com/e984f6eb-b411-4915-bd1a-581c7c4dd88f)

The **AI Text Assistant** helps you write and enhance your content

![](https://cdn-assets.productfruits.com/bec8ff8d-ca7e-461e-b4fc-6597ad9ee69c)

You can add a **URL link** or even start a **Tour** from either text or a custom button

![](https://cdn-assets.productfruits.com/40264e1f-1a66-4369-aabb-6f28985100c6)

You can also **reset the formatting** and start over

![](https://cdn-assets.productfruits.com/3af0336a-46e3-49c6-b979-2f0b8f0cc231)

## The visual template of tour & hint cards

You can create a **design template** matching your application's design in the **Branding section in the administration**. When working in the editor, all cards will begin with the default values in this template. 

To find the Look & Feel menu, click on the More icon on the left side of the Product Fruits administration and then click on Branding. This will lead to a list of your tours, hints, and checklists accompanied by the CSS customization. 

![](https://cdn-assets.productfruits.com/51ce3237-430c-40de-9019-97815fd3075d)
