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

# Styles Tab

> The Styles tab controls layout, wheel finish, the active color preset, the launcher icon and position, typography, and the close button — everything about how the game looks rather than what it says.

The **Styles** tab controls how the game looks — layout, colors, typography, and the launcher — as opposed to the [Content tab](/appearance/content-tab), which controls what it says.

## **Layout**

**Show as** sets how the game is presented on your storefront:

* **Side panel** — the game slides in as a panel
* **Popup** — the game shows as a centered popup card

**Wheel finish** lets you choose the color of the wheel's outer ring/finish from a set of preset swatches.

## **Preset**

This section shows your currently applied color preset — its swatch, name (for example, "Citrus Pop"), a **Current** badge, and a short description (for example, "Bright citrus energy with warm pops").

* Click the **pencil (edit)** icon to edit this preset's colors directly.
* Click **Change preset** to open the full preset gallery and switch to a different one.

See [Presets & Colors](/appearance/presets-and-colors) for the full gallery and color fields.

## **Launcher & Effects**

**Launcher icon** — upload a custom icon for the floating launcher bubble that sits on your storefront (see [Teaser](/appearance/preview-screens)). Accepts `.jpg`, `.png`, `.svg`, and `.jpeg`, up to 500KB. Leave empty to use the default gift icon.

**Launcher position** — where the launcher bubble sits on the page, for example **Bottom right**.

## **Typography**

Shared sizes and weights used across the Game, Email, and Winning screens. Font family itself comes from [Settings → Brand Kit](/settings/brand-kit).

| Field                   | Example |
| ----------------------- | ------- |
| Content alignment       | Center  |
| Title size              | 25px    |
| Title weight            | Medium  |
| Body size               | 14px    |
| Body weight             | Medium  |
| Eyebrow & status size   | 13px    |
| Eyebrow & status weight | Medium  |
| Button size             | 16px    |
| Button weight           | Bold    |
| Fine print size         | 12px    |
| Fine print weight       | Regular |
| Prize value size        | 46px    |
| Prize value weight      | Bold    |

## **Close Button**

Controls the "X" close button shown on the game panel:

* **Size** — for example, Medium
* **Shape** — for example, Circle
* **Show background** — toggle whether the close button has a background behind it