import { Meta } from '@storybook/addon-docs/blocks';

<Meta title="Guides/Assets/Favicons" />

# Favicons

The optimised assets are available under **preply.com** in the formats required by modern and legacy browsers, as well as Android and iOS devices.

Refer to [How to Favicon in 2022: Six files that fit most needs](https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs) for a detailed breakdown of the formats.

## Variants

Pick the approriate snippet and add it to the `<head>` section of your application.

### Preply logo

<img src="https://static.preply.com/ds/icons/favicon.svg" alt="Preply logo icon" />

```html
<!-- Preply Favicons /story/guides-assets-favicons--page -->
<link rel="icon" href="https://static.preply.com/ds/icons/rebrand-23-v0/favicon.ico" sizes="any" />
<link
    rel="icon"
    href="https://static.preply.com/ds/icons/rebrand-23-v0/favicon.svg"
    type="image/svg+xml"
/>
<link
    rel="apple-touch-icon"
    href="https://static.preply.com/ds/icons/rebrand-23-v0/icon-180.pngg"
/>
<link rel="manifest" href="https://static.preply.com/ds/icons/rebrand-23-v0/web.manifest.json" />
```
