> For the complete documentation index, see [llms.txt](https://meowcart.gitbook.io/lilyth-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://meowcart.gitbook.io/lilyth-theme/sections/spotlight.md).

# Spotlight

The **Spotlight** section contains the following default blocks:

* [Spotlight item](#spotlight-item-block)

## Section settings

<table><thead><tr><th width="217">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Color schema</td><td>A set of colors that you can apply to this section. <a href="https://help.shopify.com/en/manual/online-store/themes/theme-structure/color-scheme">Learn more.</a></td></tr><tr><td>Separator line</td><td><p>Display a line to visually separate this section from the other sections:</p><ul><li><strong>None</strong></li><li><strong>Top</strong></li><li><strong>Bottom</strong></li><li><strong>Top and bottom</strong></li></ul></td></tr></tbody></table>

## Section header settings

<table><thead><tr><th width="265">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Caption</td><td>Add text to display as a caption.</td></tr><tr><td>Heading</td><td>Add text to display as a heading.</td></tr><tr><td>Heading size</td><td><p>Change the size of the heading:</p><ul><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td>Description</td><td>Add text to display as a description.</td></tr><tr><td>Alignment</td><td><p>Determine the section header alignment:</p><ul><li><strong>Left</strong></li><li><strong>Center</strong></li><li><strong>Right</strong></li></ul></td></tr></tbody></table>

## Image settings

<table><thead><tr><th width="229">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Upload a image</td><td>Upload a image.</td></tr><tr><td>Image behavior</td><td><p>Determine the behavior of the image:</p><ul><li><strong>None</strong></li><li><strong>Ambient movement</strong></li></ul></td></tr></tbody></table>

## Card settings

<table><thead><tr><th width="260">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Heading font</td><td><p>Change the font of the heading:</p><ul><li><strong>Body font</strong></li><li><strong>Heading font</strong></li></ul></td></tr><tr><td>Heading size</td><td>Change the size of the heading. Can be from 14px to 40px, increasing arithmetically of 1px (pixel).</td></tr><tr><td>Icon width</td><td>Determine the width of the SVG icons. Can be from 40px to 100px, increasing arithmetically of 4px (pixel).</td></tr><tr><td>Icon style</td><td><p>Determine the icon style:</p><ul><li><strong>None</strong></li><li><strong>Shape</strong></li><li><strong>Circle</strong></li></ul></td></tr></tbody></table>

## Section padding settings

<table><thead><tr><th width="208">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Top padding</td><td>Determine the height of the top inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).</td></tr><tr><td>Bottom padding</td><td>Determine the height of the bottom inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).</td></tr></tbody></table>

## Block settings

### Spotlight item block

<table><thead><tr><th width="208">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Icon</td><td>Choose a SVG icon.</td></tr><tr><td>SVG</td><td>Add SVG code. SVG will be displayed instead of basic icons if provided.</td></tr><tr><td>Heading</td><td>Add text to display as a heading.</td></tr><tr><td>Text</td><td>Add text to display as a subheading.</td></tr></tbody></table>
