[Home](/index.md) › [Icons](/icons.md) › DeepL

# DeepL

DeepL is a German language AI company behind DeepL Translator, an AI translation service and API, along with its DeepL Voice and DeepL Agent products.

## At a glance

- **Page**: https://devicons.io/icons/deepl/
- **Website**: https://www.deepl.com/
- **License**: https://www.deepl.com/en/pro-license
- **Brand guidelines**: https://www.deepl.com/en/press
- **Also known as**: DeepL Translator, DeepL Voice, DeepL API
- **Tags**: [AI](/icons/tag/ai/), [Translation](/icons/tag/translation/), [API](/icons/tag/api/), [Productivity](/icons/tag/productivity/)
- **Version added**: 1.2.0
- **Contrast**: needs a light backdrop on dark backgrounds

## Files

Each file is one variant of this logo. The component name is derived from the file name.

| File | Component | Color SVG | Monochrome SVG | Font class |
| --- | --- | --- | --- | --- |
| `deepl-icon` | `DeeplIcon` | https://devicons.io/devicons/icons/deepl-icon.svg | https://devicons.io/devicons/font/deepl-icon.svg | `devicons devicons-deepl-icon` |
| `deepl` | `Deepl` | https://devicons.io/devicons/icons/deepl.svg | https://devicons.io/devicons/font/deepl.svg | `devicons devicons-deepl` |

## Install and use

```bash
npm install @dev.icons/react  # or @dev.icons/vue, @dev.icons/svelte
```

### React

```tsx
import { DeeplIcon } from "@dev.icons/react";
// Monochrome (inherits currentColor):
// import { DeeplIcon } from "@dev.icons/react/mono";

<DeeplIcon size={32} alt="DeepL logo" />
```

### Vue

```vue
<script setup>
import { DeeplIcon } from "@dev.icons/vue";
</script>

<template>
  <DeeplIcon :size="32" alt="DeepL logo" />
</template>
```

### Svelte

```svelte
<script>
  import { DeeplIcon } from "@dev.icons/svelte";
</script>

<DeeplIcon size={32} alt="DeepL logo" />
```

### Raw SVG

```html
<img src="https://devicons.io/devicons/icons/deepl-icon.svg" alt="DeepL logo" width="48" height="48" />
```

### Icon font

```css
@import "devicons/css"; /* npm install devicons */
```

```html
<i class="devicons devicons-deepl-icon"></i>
```

## About the DeepL logo

DeepL's mark is a rounded hexagon shaped like a speech bubble, with a tail at the lower right. Inside, three dots joined by two lines form a sideways branching shape that reads like text moving from one point to two. The official logo pack pairs the mark with a geometric sans "DeepL" wordmark, and the dots and lines are cut out of the hexagon rather than drawn in white.

Both the mark and the wordmark use Deep Blue (#0F2B46). DeepL's newsroom offers the logo in Deep Blue and White, for digital (RGB) and print (CMYK). Deep Blue is nearly black, so use the white version, or the mono file here with a light `currentColor`, on dark backgrounds.

## When to use this logo

Use the DeepL logo in machine translation comparisons, localization pipeline diagrams, i18n tooling docs and API integration guides for translating content. It pairs naturally with Google Translate, Microsoft Translator, Crowdin, Lokalise and Phrase. The hexagon mark works well as a compact provider icon in translation settings. Use the full lockup in partner and integration listings.

## Related icons

- [Make](/icons/make.md)
- [Monica](/icons/monica.md)
- [OpenAI](/icons/openai.md)
- [Cohere](/icons/cohere.md)
- [DeepAI](/icons/deepai.md)
- [Fireworks AI](/icons/fireworks.md)
- [Fish Audio](/icons/fish-audio.md)
- [Gemini Notebook](/icons/google-notebooklm.md)

## Browse the catalog
- Previous: [DeepAI](/icons/deepai.md)
- Next: [DeepSeek](/icons/deepseek.md)
- [All icons](/icons.md)