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

# Text with icons

{% embed url="<https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da>" %}

You can add text with icons to clearly define content or policies in your store.

<table><thead><tr><th width="279">Section</th><th>Description</th></tr></thead><tbody><tr><td>Color scheme</td><td><p>In this section, you can change the background and foreground color of a section using the color scheme.</p><ul><li>Scheme 1</li><li>Scheme 2</li><li>Scheme 3</li><li>Scheme 4</li><li>Scheme 5</li></ul></td></tr><tr><td>Heading</td><td><p><strong>Text</strong>  </p><p>Enter text to defines the main heading of the section. </p><p></p><p><strong>Text color</strong> </p><p>You can customize the foreground color of the heading by using the color option. </p><p></p><p><strong>Size</strong></p><p>Following is the font size customization of the heading of the section:</p><ul><li>Small</li><li>Medium</li><li>Large</li></ul><p></p><p><strong>Alignment</strong> </p><p>Customization of the "Alignment" in this is as follows:</p><ul><li>Left</li><li>Center</li></ul></td></tr><tr><td>Icon width</td><td>"Icon width" is used to change the width of the section icon. You can give the minimum width "20px" and maximum width "50px".</td></tr><tr><td>Icon color</td><td>Customize icon color of the section by using this settings.</td></tr><tr><td>Show icon background color</td><td>Customize icon background color by using this setting in text with icons section.</td></tr><tr><td>Text size on desktop</td><td><p>Following is the text size customization of the the section:</p><ul><li>Small</li><li>Medium</li><li>Large</li></ul></td></tr><tr><td>Content alignment</td><td><p>Following is the content alignment customization of the the section:</p><ul><li>Left</li><li>Center</li><li>Right</li></ul></td></tr><tr><td>Enable border around blocks</td><td>Enable this settings to show border around the blocks in text with icons section. </td></tr><tr><td>Spacing around blocks</td><td>"Spacing around blocks" is use to set spacing around blocks in the section. You can set a minimum of “0px” and a maximum of “15px” spacing around blocks.</td></tr><tr><td>Blocks color scheme</td><td><p>In this section, you can change the background and foreground color of blocks using the color scheme.</p><ul><li>Scheme 1</li><li>Scheme 2</li><li>Scheme 3</li><li>Scheme 4</li><li>Scheme 5</li></ul></td></tr></tbody></table>

<figure><img src="https://895706505-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0PKM9UHryXjPN3UYSTy0%2Fuploads%2FQ0hN41Dou9GHyk3YKy4S%2Ftext-with-icons.png?alt=media&amp;token=a2d3dde5-d4a4-4c7b-b49d-59f581431016" alt=""><figcaption></figcaption></figure>

## **Add text with icon**

Click on "**Add text with icon**" and its customization is as follows.

<table><thead><tr><th width="193">Block</th><th>Description</th></tr></thead><tbody><tr><td>Icon</td><td>In the section, the icons are given to select.</td></tr><tr><td>Heading</td><td>Enter text to display as a title in the section.</td></tr><tr><td>Description</td><td>Enter text to display in the “Description” section.</td></tr></tbody></table>

<figure><img src="https://895706505-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0PKM9UHryXjPN3UYSTy0%2Fuploads%2FUSV2d2R8CzymZAC3PqCp%2Ftext-with-icons-blocks.png?alt=media&amp;token=e83d5336-9b84-40ec-95b2-a134d3b36179" alt=""><figcaption></figcaption></figure>
