---
url: https://docs.youcan.shop/themes/tags/stylesheet.md
---

# `stylesheet`

With the `stylesheet` tag, CSS is added to the page in an HTML `<style>` tag with a `data-youcan` attribute.

The same CSS is added only once per page. When a snippet with a `stylesheet` tag is rendered several times, for example once for each product card, you get one `<style>` tag.

```liquid
{% stylesheet %}
  CSS_rules
{% endstylesheet %}
```

### Example

```liquid
{% stylesheet %}
  .product-card {
    border-radius: 8px;
  }
{% endstylesheet %}
```

::: tip Output

```html
<style data-youcan>
  .product-card {
    border-radius: 8px;
  }
</style>
```

:::