> For the complete documentation index, see [llms.txt](https://nextsky.gitbook.io/purity-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nextsky.gitbook.io/purity-theme/global-sections/overlay-group/offers-popup/theme-block-image-with-text.md).

# Theme block - Image with text

### General settings

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2F3H2Ru8PyMWxdW842oLgG%2FScreenshot_135.png?alt=media&amp;token=5b89e228-4511-46f3-b975-da4a05e31577" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="215">Settings</th><th>Description</th></tr></thead><tbody><tr><td><strong>Color scheme</strong></td><td>Select colors from <strong>Theme settings -> Colors</strong></td></tr><tr><td><strong>Image</strong></td><td>Upload your desired image <em><strong>(360px x 200px recommended)</strong></em></td></tr></tbody></table>

### Block settings

#### Heading, Subheading, Description

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2FMzeQgMRHs0HfUPUbPymR%2Fimage.png?alt=media&amp;token=734da8e4-d37b-412e-8829-0b72f12a712a" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Heading, Subheading, Description</strong></td><td>Custom title block</td></tr><tr><td><strong>Width</strong></td><td><p>2 options for content's width:</p><ul><li><strong>Fit</strong></li><li><strong>Fill</strong></li></ul></td></tr><tr><td><strong>Typography - Preset</strong></td><td>Choose a preset style (font, size, weight) from <strong>Theme settings → Typography</strong>.</td></tr><tr><td><strong>Background</strong></td><td>Toggle ON to enable a background area behind the text.</td></tr><tr><td><strong>Background color</strong></td><td>Select the color for the text background.<br><em>* Note: Only appears when <strong>Background</strong> is enabled</em></td></tr><tr><td><strong>Corner radius</strong></td><td>Adjust the roundness of the background corners<br><em>* Note: Only appears when <strong>Background</strong> is enabled</em></td></tr><tr><td><strong>Padding top/bottom</strong></td><td>Adjust these values to control the amount of space between the section’s content and its outer edges.</td></tr></tbody></table>

#### Button <a href="#button" id="button"></a>

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2F7yZzyrdfBZryDZxcXdC3%2Fimage.png?alt=media&amp;token=c55539f5-2932-4c44-bc83-51a920b3e0f4" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Button label</strong></td><td>Custom name button, if left empty, the button will be hidden</td></tr><tr><td><strong>Button link</strong></td><td>The link URL you want to add</td></tr><tr><td><strong>Button type</strong></td><td><p>The style of the button</p><ul><li><strong>Fill</strong></li><li><strong>Outline</strong></li></ul></td></tr><tr><td><strong>Open link in new tab</strong></td><td>Open the link in a new browser tab</td></tr><tr><td><strong>Spacing bottom</strong></td><td>Spacing between the button and the next component</td></tr></tbody></table>