# Integrate your own fonts

{% hint style="info" %}
The[ official Shopware documentation](https://developer.shopware.com/docs/guides/plugins/plugins/storefront/add-custom-assets.html) explains how to integrate your own fonts and assets into a **child theme** or an add-on extension. In this article, I will show you how to store the fonts on your server and use them independently of **additional extensions**.
{% endhint %}

### Upload your Fonts

In the Shopware installation on your server, you will find the folder `public/fonts`. Store the fonts you want to integrate there:

<div align="left"><figure><img src="/files/0Fxj8OQtBDF3HHGHX5a9" alt=""><figcaption></figcaption></figure></div>

In this example, I have included the Open Sans font.

### Initialize font via font-face

You can integrate individual CSS in my themes. This is necessary to initialize the font. You can find out where to integrate the CSS in the following article:

{% content-ref url="/pages/INVqXwx5cnZV3E4mBh7S" %}
[Individual Code](/shopware-theme/en/setup/individual-code.md)
{% endcontent-ref %}

Now use the following CSS code to initialize your fonts:

```
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/Open Sans/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/fonts/Open Sans/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/Open Sans/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/Open Sans/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/fonts/Open Sans/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/Open Sans/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}

```

{% hint style="info" %}
Please note that the **path to your font** must be correct. Depending on how you have set up your Shopware instance, the path will differ. In this example, I have used the default path to the fonts folder:

`/fonts/yourFontFolder/yourFont.ttf`
{% endhint %}

You can then simply use the font in the theme settings:

<div align="left"><figure><img src="/files/sv8e3088nbprxiObBreK" alt=""><figcaption></figcaption></figure></div>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.rh-webdesign.com/shopware-theme/en/for-developers/integrate-your-own-fonts.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
