# Featured image

Use **Featured Image** blocks to break up long product grids with editorial content or promotions. Add a featured image to the first column or row of your collection to highlight your brand, showcase key products, or promote special offers.

<figure><img src="https://2636770384-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsD7BEEDU3B7WiEJlN0F7%2Fuploads%2F58ezLe91lodmYKubEamq%2Ffeatured-image.gif?alt=media&#x26;token=421f7934-6d5c-44d9-a39c-a7fa60d884b1" alt="The Gif is scrolling through all settings inside the featured image block from the theme customizer"><figcaption><p>Expand Collection products to add and configure Featured image</p></figcaption></figure>

<table><thead><tr><th width="165.94439697265625">Settings</th><th width="140.2100830078125" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td align="center"><code>image_picker</code></td><td>Image shown (recommended 1400x1400px .jpg).</td></tr><tr><td>Image position</td><td align="center"><code>range</code></td><td>Placement order (1-24).</td></tr><tr><td><strong>Typography</strong></td><td align="center"></td><td></td></tr><tr><td>Heading</td><td align="center"><code>text</code></td><td>Heading displayed on the featured image.</td></tr><tr><td>Heading size</td><td align="center"><code>select</code></td><td>Font size options: <code>Mini</code>, <code>Extra small</code>, <code>Small</code>, <code>Medium</code>, <code>Large</code>, or <code>Extra large</code>.</td></tr><tr><td>Text</td><td align="center"><code>richtext</code></td><td>Descriptive text below the heading.</td></tr><tr><td><strong>Button</strong></td><td align="center"></td><td></td></tr><tr><td>Label</td><td align="center"><code>text</code></td><td>Button label text.</td></tr><tr><td>Link</td><td align="center"><code>url</code></td><td>URL the button will link to.</td></tr><tr><td>Color</td><td align="center"><code>select</code></td><td>Color style: <code>Black</code>, <code>White</code>, <code>Primary</code>, or <code>Secondary</code>.</td></tr><tr><td>Size</td><td align="center"><code>select</code></td><td>Size: <code>Small</code>, <code>Medium</code>, or <code>Large</code>.</td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Style: <code>Solid</code>, <code>Outline</code>, or <code>Text</code>.</td></tr><tr><td>Show button arrow</td><td align="center"><code>checkbox</code></td><td>Shows an arrow next to the button label if enabled.</td></tr><tr><td><strong>Colors</strong></td><td align="center"></td><td></td></tr><tr><td>Text</td><td align="center"><code>color</code></td><td>Text color (overrides theme color scheme).</td></tr><tr><td>Overlay type</td><td align="center"><code>select</code></td><td>Adds an overlay: <code>Disabled</code>, <code>Opacity</code>, or <code>Text underlay</code>.</td></tr><tr><td><strong>Advanced</strong></td><td align="center"></td><td></td></tr><tr><td>Heading SEO tag</td><td align="center"><code>select</code></td><td>HTML heading tag for SEO: <code>Automatic</code>, or <code>H1-H6</code>.</td></tr></tbody></table>
