# Color block and color scheme

* The color block is used in sections to customize the color for only that section. 
* The [color scheme](https://help.shopify.com/en/manual/online-store/themes/theme-structure/color-scheme) is a set of colors. It is created to consistently apply colors throughout different sections of the Smind, allowing for quick customization of your storefront's color.

## Overview

Below are all the colors in a color scheme that will be used for all sections of Smind.

<div align="left"><figure><img src="/files/G6Bpb5wk0H2WgOVWmSX0" alt=""><figcaption></figcaption></figure></div>

<table><thead><tr><th width="243">Color name</th><th>Scope of influence</th></tr></thead><tbody><tr><td>Background</td><td>Color is applied to the background of the sections.</td></tr><tr><td>Background gradient</td><td>A gradient of colors is applied to the background of some sections. Background gradients replace the background where possible.</td></tr><tr><td>Text</td><td>Color is applied to the block text and border.</td></tr><tr><td>Subtext</td><td>Color is applied to the subheading of sections.</td></tr><tr><td>Solid button background</td><td>Color is applied to the primary button background.</td></tr><tr><td>Solid button label</td><td>Color is applied to the primary button text.</td></tr><tr><td>Outline button</td><td>Color is applied to the secondary button text and border.</td></tr><tr><td>Shadow</td><td>Color is applied to the shadows.</td></tr></tbody></table>

#### For example:

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

## Color Block For Smind Section

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjRi1aohY8I4BPjjvC9cH%2Fuploads%2Fb74NgloLz02iqaFXvMZz%2FColor%20Block.mp4?alt=media&token=63ef568f-9e0a-43e0-b97d-5510ef756d60>" %}

To add **Color** block to the section (skip this step if "Color block" is already in the section), click **Add Block**

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

{% hint style="danger" %}
When you use the color block, it only affects the section that contains it, and the color scheme will not work in that section.
{% endhint %}

{% hint style="danger" %}
If you change the background color in the color block, but the background of the section doesn't change, it might be because the **background block** is active. To apply the background color, you need to either hide or delete the background block.
{% endhint %}

## Color Scheme For Smind Section

To understand how to use the color scheme, read [this article](https://help.shopify.com/en/manual/online-store/themes/theme-structure/color-scheme).

To change the color scheme, click on the **Global** section **> Smind Styles > Color ,** and then customize the color schemes

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

{% hint style="danger" %}
If you change the color scheme, but the color of the section doesn't change, it might be because the **color block** is active. To apply the color scheme, you need to either hide or delete the color block.
{% endhint %}

{% hint style="danger" %}
If you change the color scheme, but the background of the section doesn't change, it might be because the **background block** is active. To apply the background color, you need to either hide or delete the background block.
{% endhint %}

This section is a global style manager where each item here lets you define the look & feel for your store. Here’s what each one controls:

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

| Control                 | What It Does                                                                      |
| ----------------------- | --------------------------------------------------------------------------------- |
| Background              | The default page-section or block background color.                               |
| Background gradient     | An optional two-tone gradient that replaces the plain Background where supported. |
| Text                    | The primary text color used for headings                                          |
| Subtext                 | The secondary text color used for captions and description                        |
| Solid button background | The fill color for the primary buttons across all blocks.                         |
| Solid button label      | The text color of button label                                                    |
| Outline button          | The border color for outline style buttons.                                       |
| Shadow                  | The color of shadow applied to the blocks                                         |

## Configure border and shadow colors in sections with two color schemes

For sections with two color schemes, the "Section color scheme" will be applied to both the border and shadow colors of the cards.

#### For example:

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

## Color Scheme For Smind Theme

If you are using Smind theme, you can change via Theme Setting &#x20;

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjRi1aohY8I4BPjjvC9cH%2Fuploads%2FBoB2Iuu5fG1xhcwVFsNN%2FColor%20Scheme.mp4?alt=media&token=09d46926-02f7-44f8-be67-3a200ad47a63>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.smind.io/guides/color-block-and-color-scheme.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.