---
title: "Liquid tags: style"
description: Generates an HTML `<style>` tag with an attribute of `data-shopify`.
api_name: liquid
source_url:
  html: https://shopify.dev/docs/api/liquid/tags/style
  md: https://shopify.dev/docs/api/liquid/tags/style.md
---

# style

Generates an HTML `<style>` tag with an attribute of `data-shopify`.

***

Note

If you reference [color settings](https://shopify.dev/themes/architecture/settings/input-settings#color) inside `style` tags, then the associated CSS rules will update as the setting is changed in the theme editor, without a page refresh.

***

## Syntax

```oobleckTag
{% style %}
  CSS_rules
{% endstyle %}
```

CSS\_rules

The desired CSS rules for the `<style>` tag.

```liquid
{% style %}
  .h1 {
    color: {{ settings.colors_accent_1 }};
  }
{% endstyle %}
```

##### Code

```
{% style %}
  .h1 {
    color: {{ settings.colors_accent_1 }};
  }
{% endstyle %}
```

##### Data

```
{
  "settings": {
    "colors_accent_1": "#121212"
  }
}
```

## Output

```html
<style data-shopify>
  .h1 {
    color: #121212;
  }
</style>
```