# Logos

In this area you define the logos and icons. If the viewport is larger than 991px, the desktop logo is displayed. Between 991px and 767px the tablet logo is displayed. If the viewport is smaller than 767px, the mobile logo is displayed.

The theme also allows you to set a separate logo for the footer and the offcanvas topbar and much more.

## Header

The logo in the header of the online shop.

![](/files/-MHWm-zLf7SP9uz9pf-i)

## Misc

The favicon is displayed in front of the URL in the browser and the app & share icon is displayed, for example, as a preview when the page is shared on social networks. 

## Contrast header

Set logos for the different selectable contrast headers. In conjunction with the overlay header feature, you can choose different contrast headers. You can find out more about this function in the [Header > Contrast Header](#contrast-header) section.

* **Heller Header - dunkles Logo:** Wähle ein Logo mit Kontrast zu hellen Flächen.
* **Dunkler Header - helles Logo:** Wähle ein Logo mit Kontrast zu dunklen Flächen.
* **Invertierter Header - invertiertes Logo:** Wählen ein Logo mit einem Kontrast, der dem des Standardlogos entgegengesetzt ist.

## Footer

The theme supports displaying a logo in the footer of the page. In the footer area you can position the logo either in the newsletter, in the hotline column, in the social media column or in a separate column.

Example:

![Logo im Newsletter-Bereich](/files/-MHWnFX-kGRuzK4dpHi-)

## Offcanvas top bar

To strengthen your brand, you can also play out a logo for Offcanvas top bar.

![](/files/-MHWnK286nqmOG1ZgeQR)


---

# 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://themedocs.zenit.design/en/styling/logos.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.