# Appearance

## What Appearance helps you do

Appearance lets you customize how a published workflow looks to end users.

This setting is available only for:

* **App**
* **Chatbot**

You can edit **Appearance** only after the App or Chatbot has been **published**.

Automation workflows do not use this setting.

<figure><img src="/files/x9N6rMklst3yh4F3aCVD" alt=""><figcaption></figcaption></figure>

### Before you start

Make sure your workflow is:

* An **App** or **Chatbot**
* Already **published**

If the workflow is still in draft, you cannot edit its appearance.

### Appearance for App

For an **App**, you can customize these sections.

#### General

Use **General** to define the basic look and identity of the App.

You can edit:

* **Title**
* **Subtitle**
* **Logo/icon**
* **Cover**
* **Color and style**

This is where you make the App feel branded and easy to recognize.

#### Inputs

Use **Inputs** to control how input fields appear to the user.

This helps you make the App easier to complete and easier to understand.

#### Outputs

Use **Outputs** to control how results are shown after the App runs.

This is useful when you want the final answer to feel clearer and more polished.

#### Security

Use **Security** to control who can open the App.

You can configure:

* **public access**
* **Lock with a password**

### Appearance for Chatbot

For a **Chatbot**, you can customize these sections.

#### General

Use **General** to shape the chatbot's identity and first impression.

You can edit:

* **Title**
* **Tagline**
* **Logo/icon**
* **Cover**
* **Color and style**
* **Call to action button**
* **Contact us button**

#### Contact

Use **Contact** to control lead capture and contact collection.

You can configure:

* **Contact generation:** ask for customer information
* **Allow chat as a guest**
* **Data to collect:** define your own fields, such as `name`, `phone number`, and more

This section is useful when the chatbot supports sales, support, or consultation flows.

#### Widget

Use **Widget** to control how the chatbot appears when embedded.

You can edit:

* **Widget icon**
* **Look & feel**
* **Prominence**
* **Position**

#### Messages

Use **Messages** to define how the conversation starts.

You can configure:

* **Welcome message**
* **Opening questions**
* **Initial questions**

This helps you guide users into the right conversation faster.

#### Security

Use **Security** to control access to the chatbot.

You can configure:

* **Public access**
* **Lock with a password**

## Best practices

Keep the experience simple for end users.

Use these rules:

* Keep titles short and clear
* Use covers and colors that match your brand
* Ask only for the contact data you really need
* Protect private flows with a password

### Next steps

* Publish your workflow in [Publish a workflow](/workflow-builder/publish-a-workflow.md).
* Review reusable sharing options in [Create template](/workflow-builder/create-template.md).
* Track usage and results in [History](/workflow-builder/history.md).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.diaflow.io/workflow-builder/appearance.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.