---
title: settings_data.json
description: About the settings_data.json config file.
source_url:
  html: https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json
  md: https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json.md
---

ExpandOn this page

* [Location](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#location)
* [Schema](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#schema)
* [Usage](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#usage)

# settings\_data.json

The `settings_data.json` file contains the setting values for a theme based on the settings included in [settings\_schema.json](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-schema-json).

For example, you can use the following theme setting to allow a merchant to choose a color for the page background:

## config/settings\_schema.json

```json
{
  "name": "Colors",
  "settings": [
    {
      "type": "color",
      "id": "color_page_bg",
      "label": "Page background",
      "default": "#FFFFFF"
    }
  ]
}
```

This adds an entry for `color_page_bg` in `settings_data.json`:

## config/settings\_data.json

```json
...
"color_page_bg": "#FFFFFF"
...
```

Tip

In this example, the value of `color_page_bg` is `#FFFFFF` due to the [default](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#standard-attributes) setting attribute.

Any time that the value of `color_page_bg` is changed in the theme editor, `settings_data.json` is updated with the new value.

***

## Location

The `settings_data.json` file is located in the `config` directory of the theme:

```text
└── theme
  ...
  ├── config
  |   ├── settings_data.json
  |   ├── settings_schema.json
  |   └── markets.json
  └── locales
```

***

## Schema

The `settings_data.json` file has the following parent objects:

| Object | Description | Required |
| - | - | - |
| `current` | Contains all of the setting values that are currently saved in the theme editor. | Yes |
| `presets` | Contains an object for each [theme preset](#theme-presets). Each object is in the same format as `current`. | Yes |
| `platform_customizations` | Contains setting values for [platform-controlled settings](#platform-controlled-settings). | No - this object is added by Shopify if a merchant uses a platform-controlled setting. |

For example:

```json
{
"current": {
  "color_page_bg": "#FFFFFF",
  ...
},
"presets": {
  "preset name": {
    "color_page_bg": "#000000",
    ...
  }
}
}
```

***

## Usage

When you're working with the `settings_data.json` file, you should familiarize yourself with the following concepts:

* [Theme presets](#theme-presets)
* [Platform-controlled settings](#platform-controlled-settings)
* [Limitations](#limitations)

### Theme presets

Presets enable you to create up to five pre-configured designs from the same theme code base. Each preset includes a combination of layout options, color schemes, typography, and other visual elements.

Theme presets are included under one theme package. This gives merchants multiple customization options that they can apply to their store to change the general look and feel of the theme without extensive design skills or coding knowledge. Each preset gets its own dedicated listing page on the [Theme Store](https://themes.shopify.com/) that aligns to a primary industry and catalog size to appeal to a specific merchant segment.

Selecting a theme preset updates the `current` object to use the associated theme preset values. However, only values from [presentational settings](#presentational-settings) are updated.

#### Presentational settings

Presentational settings are settings that are related to a visual aspect of the theme. Examples of presentational settings include the color and font applied to text, or whether a specific element is visible.

The following input types are presentational settings. Values for these settings are overwritten when switching theme styles.

* [checkbox](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#checkbox)
* [color](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#color)
* [color\_background](https://shopify.dev/docs/themes/architecture/settings/input-settings#color_background)
* [color\_scheme](https://shopify.dev/docs/themes/architecture/settings/input-settings#color_scheme)
* [color\_scheme\_group](https://shopify.dev/docs/themes/architecture/settings/input-settings#color_scheme_group)
* [font\_picker](https://shopify.dev/docs/themes/architecture/settings/input-settings#font_picker)
* [number](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#number)
* [radio](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#radio)
* [range](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#range)
* [select](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#select)

### Platform-controlled settings

In the theme editor, Shopify exposes a [custom CSS setting](https://help.shopify.com/manual/online-store/themes/theme-structure/extend/add-css) at the theme and section level. Any custom CSS the merchant adds at the theme level is stored in the `platform-customizations` object's `custom_css` attribute.

This setting is intended to enable users to customize the look and feel of their storefront without editing theme code. As a theme developer, you shouldn't add this setting, or edit the value of this setting after it's set. Instead, you should use dedicated [CSS assets](https://shopify.dev/docs/storefronts/themes/architecture#assets) and [`stylesheet` Liquid tags](https://shopify.dev/docs/storefronts/themes/best-practices/javascript-and-stylesheet-tags#stylesheet), and introduce customization options for CSS in these areas using [theme settings](https://shopify.dev/docs/storefronts/themes/architecture/settings).

### Limitations

* The `settings_data.json` file size can't exceed 1.5MB.
* A theme can't contain more than five presets.

***

* [Location](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#location)
* [Schema](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#schema)
* [Usage](https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json#usage)