---
title: "Liquid filters: class_list"
description: Generates the list of style classes for a [style setting](/storefronts/themes/architecture/settings/style-settings) or a collection of settings.
api_name: liquid
source_url:
  html: https://shopify.dev/docs/api/liquid/filters/class_list
  md: https://shopify.dev/docs/api/liquid/filters/class_list.md
---

# class\_​list

```oobleck
settings.layout | class_list
```

returns [string](https://shopify.dev/docs/api/liquid/basics#string)

Generates the list of style classes for a [style setting](https://shopify.dev/storefronts/themes/architecture/settings/style-settings) or a collection of settings.

Developer preview

Style settings are currently only available as part of the [Theme blocks developer preview](https://shopify.dev/storefronts/themes/architecture/blocks/theme-blocks/developer-preview).

```liquid
{{ settings.layout | class_list }}
```

##### Code

```
{{ settings.layout | class_list }}
```

##### Data

```
{
  "settings": {
    "layout": {
      "align-items": "center",
      "flex-direction": "row",
      "gap": "20px",
      "justify-content": "flex-start"
    }
  }
}
```

## Output

```html
```