> For the complete documentation index, see [llms.txt](https://palo-alto.presidiocreative.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://palo-alto.presidiocreative.com/theme-settings/settings/buttons.md).

# Buttons

Customize the appearance of your store’s **buttons** to match your brand’s tone and usability goals. Control button typography, style, shape, and size for primary, secondary, and responsive button states. These settings help maintain consistency across calls to action.

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

<table><thead><tr><th width="219.09112548828125">Settings</th><th width="141.48699951171875" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Font</td><td align="center"><code>select</code></td><td>Choose the font family for button text: <code>Body</code>, <code>Heading</code>, or <code>Accent</code>.</td></tr><tr><td>Weight</td><td align="center"><code>select</code></td><td>Set the font weight: <code>Light</code>, <code>Normal</code>, or <code>Bold</code>.</td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Choose button shape: <code>Square</code>, <code>Rounded</code>, or <code>Pill</code>.</td></tr><tr><td>Letter spacing</td><td align="center"><code>range</code></td><td>Adjust the spacing between letters in button text.</td></tr><tr><td>Uppercase</td><td align="center"><code>checkbox</code></td><td>Toggle uppercase text on all buttons.</td></tr><tr><td>Color</td><td align="center"><code>color</code></td><td>Set <strong>primary button</strong> color.</td></tr><tr><td>Color</td><td align="center"><code>color</code></td><td>Set <strong>secondary button</strong> color.</td></tr><tr><td><strong>Advanced</strong></td><td align="center"></td><td></td></tr><tr><td>Font size (Small button)</td><td align="center"><code>range</code></td><td>Set font size percentage for small buttons.</td></tr><tr><td>Width</td><td align="center"><code>range</code></td><td>Small button width.</td></tr><tr><td>Height</td><td align="center"><code>range</code></td><td>Small button height.</td></tr><tr><td>Font size (Medium button)</td><td align="center"><code>range</code></td><td>Set font size percentage for medium buttons.</td></tr><tr><td>Width</td><td align="center"><code>range</code></td><td>Small button width.</td></tr><tr><td>Height</td><td align="center"><code>range</code></td><td>Small button height.</td></tr><tr><td>Font size (Large button)</td><td align="center"><code>range</code></td><td>Set font size percentage for large buttons.</td></tr><tr><td>Width</td><td align="center"><code>range</code></td><td>Small button width.</td></tr><tr><td>Height</td><td align="center"><code>range</code></td><td>Small button height.</td></tr></tbody></table>
