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

# Styling

> Customize the appearance of the product questions widget so it blends into your storefront.

After you generate questions, you can style the widget so it feels native to your product pages. You manage styling in the **Branding** tab of your assistant's **AI product questions** area.

<Note>
  **Before you start:** complete the initial [setup](/en/user-guide/product-questions/setup) so a configuration exists. A live preview is built in, so you can style the widget without embedding it first. Embed the widget when you want to see it on your real storefront.
</Note>

## Customize the appearance

<Steps>
  <Step title="Open the Branding tab">
    Open your assistant, select **AI product questions**, and switch to the **Branding** tab.
  </Step>

  <Step title="Style the container">
    Under **Container**, set the background color, padding, corner radius, an optional border, and the gap between questions.
  </Step>

  <Step title="Style the buttons">
    Under **Buttons**, set the background and text color, font size and weight, padding, corner radius, and an optional border. The font is inherited automatically from your website, so there's no separate font setting.
  </Step>

  <Step title="Preview and save">
    Watch the live preview update as you change settings, then click **Save**.
  </Step>
</Steps>

<Note>
  Enable **Custom question button** to show an extra "Ask something else" button that opens the chat for a free-form question. Keep **Use button style** on to match your other buttons, or turn it off to style it separately.
</Note>

<Check>
  When the widget's colors and spacing match your theme, the questions feel like a built-in part of the page rather than an add-on.
</Check>

## Styling tips

<Tip>
  Match the button's background color to your primary brand color and keep the container padding and gap consistent with surrounding page elements, so the questions read as part of your product page.
</Tip>

## Next steps

<CardGroup cols={2}>
  <Card title="Back to setup" icon="wand-magic-sparkles" href="/en/user-guide/product-questions/setup">
    Generate questions and embed the widget on your product pages.
  </Card>

  <Card title="Product Questions overview" icon="circle-question" href="/en/user-guide/product-questions/overview">
    Learn how product questions help shoppers and lift conversion.
  </Card>
</CardGroup>