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

# Question styling

> Style a single question with the Field theme panel: pick a preset, font, size, corner radius, alignment, and colors.

A [theme](/user-guide/design/themes) styles your whole form. When one question needs to look different, use its **Field theme** panel to style just that question.

<Frame caption="Select a question and open its Field theme panel to style it.">
  <video autoPlay muted loop playsInline className="w-full" src="https://mintcdn.com/formai-app/XBaZxbZCaxkDZx0d/videos/question-styling.mp4?fit=max&auto=format&n=XBaZxbZCaxkDZx0d&q=85&s=fbedd6923dcdcd3a6dc1c3b1df676c43" aria-label="Selecting a question, then opening its Field theme panel with font, size, corner radius, alignment and color options" data-path="videos/question-styling.mp4" />
</Frame>

## Style a question

<Steps>
  <Step title="Select the question">
    Click the question on the canvas.
  </Step>

  <Step title="Open Field theme">
    Click **Field theme**, the third button at the top right of the question block.
  </Step>

  <Step title="Change the design">
    Adjust the options in the panel. See the table below for what each one controls.
  </Step>

  <Step title="Check the result">
    Look at the question on the canvas, or open [Preview](/user-guide/editor/preview) to see it on desktop and mobile.
  </Step>
</Steps>

## Field theme options

| Option | What it controls |
| - | - |
| **Theme** | A preset dropdown to start from. |
| **Font** | The typeface, for example Inter. |
| **Size** | Text size: sm, md, or lg. |
| **Corner radius** | How rounded the corners are. |
| **Alignment** | Left, center, or right. |

### Colors

Each color has a hex input, so you can enter exact brand values such as `#8800B2`.

| Color | What it styles |
| - | - |
| **Title** | The question title. |
| **Description** | The question description. |
| **Answer** | The answer text. |
| **Icon** | Icons in the question. |
| **Button text** | The text on buttons. |
| **Button background** | The fill of buttons. |
| **Background** | The question background. Use a color or a background image. |

<Tip>
  Start with a [theme](/user-guide/design/themes) that is close to your brand, and use **Field theme** only for the few questions that need to stand out. A consistent look is easier for respondents to follow.
</Tip>

## Next steps

<CardGroup cols={2}>
  <Card title="Themes" icon="palette" href="/user-guide/design/themes">
    Style the whole form at once.
  </Card>

  <Card title="Question settings" icon="sliders" href="/user-guide/editor/question-settings">
    Change how a question behaves, not just how it looks.
  </Card>

  <Card title="Preview" icon="eye" href="/user-guide/editor/preview">
    Check your styling on desktop and mobile.
  </Card>

  <Card title="Form settings" icon="gear" href="/user-guide/settings/form-settings">
    Control branding, the progress bar, and respondent-facing text.
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.