---
title: 'Liquid objects: color_scheme_group'
description: >-
  A color_scheme_group from a [`color_scheme_group`
  setting](/themes/architecture/settings/input-settings#color_scheme_group).
api_name: liquid
source_url:
  html: 'https://shopify.dev/docs/api/liquid/objects/color_scheme_group'
  md: 'https://shopify.dev/docs/api/liquid/objects/color_scheme_group.md'
---

# color\_​scheme\_​group

A color\_scheme\_group from a [`color_scheme_group` setting](https://shopify.dev/themes/architecture/settings/input-settings#color_scheme_group).

***

Tip

To learn about color schemes in themes, refer to [`color_scheme` setting](https://shopify.dev/themes/architecture/settings/input-settings#color_scheme).

***

```json
{}
```

##### Example

```
{}
```

### Referencing color\_scheme\_group settings directly

```liquid
{% for scheme in settings.color_schemes %}
  .color-{{ scheme.id }} {
    --color-background: {{ scheme.settings.background }};
    --color-text: {{ scheme.settings.text }};
  }
{% endfor %}
```

##### Code

```
{% for scheme in settings.color_schemes %}
  .color-{{ scheme.id }} {
    --color-background: {{ scheme.settings.background }};
    --color-text: {{ scheme.settings.text }};
  }
{% endfor %}
```

##### Data

```
{
  "settings": {
    "color_schemes": {}
  }
}
```

## Output

```html
.color-background-1 {
    --color-background: #FFFFFF;
    --color-text: #121212;
  }


  .color-background-2 {
    --color-background: #F3F3F3;
    --color-text: #121212;
  }


  .color-inverse {
    --color-background: #121212;
    --color-text: #FFFFFF;
  }


  .color-accent-1 {
    --color-background: #121212;
    --color-text: #FFFFFF;
  }


  .color-accent-2 {
    --color-background: #334FB4;
    --color-text: #FFFFFF;
  }
```