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

# Kling AI

Kling AI is an AI video and image generator developed by Kuaishou that turns text prompts, images and reference media into short video clips.

## At a glance

- **Page**: https://devicons.io/icons/kling/
- **Website**: https://kling.ai/
- **License**: https://kling.ai/docs/user-policy
- **Also known as**: Kling, KlingAI, 可灵, Keling AI
- **Tags**: [AI](/icons/tag/ai/), [Video](/icons/tag/video/), [Image Generation](/icons/tag/image-generation/), [China](/icons/tag/china/)
- **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 |
| --- | --- | --- | --- | --- |
| `kling-icon` | `KlingIcon` | https://devicons.io/devicons/icons/kling-icon.svg | https://devicons.io/devicons/font/kling-icon.svg | `devicons devicons-kling-icon` |
| `kling` | `Kling` | https://devicons.io/devicons/icons/kling.svg | https://devicons.io/devicons/font/kling.svg | `devicons devicons-kling` |

## Install and use

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

### React

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

<KlingIcon size={32} alt="Kling AI logo" />
```

### Vue

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

<template>
  <KlingIcon :size="32" alt="Kling AI logo" />
</template>
```

### Svelte

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

<KlingIcon size={32} alt="Kling AI logo" />
```

### Raw SVG

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

### Icon font

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

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

## About the Kling AI logo

The current Kling AI mark is an outlined shape: two curved, interlocking bands that wrap around an inner ellipse, drawn with a single line weight. The full logo pairs it with a geometric "KlingAI" wordmark. Both files come from the vector logo in the header of kling.ai.

The logo is monochrome. Kling uses it in white on its dark website, and this set ships it in black (#000000). Use the monochrome version, which follows the text color, on dark backgrounds.

## When to use this logo

Use the Kling AI logo in AI video generator comparisons, text-to-video and image-to-video model pickers, creative tool directories, and docs for APIs or workflow tools that call Kling models. It pairs naturally with Runway, Pika, Luma Dream Machine, Hailuo, PixVerse and Google Veo, and with Kuaishou when you show the company behind it.

## Related icons

- [Hailuo AI](/icons/hailuo.md)
- [Adobe Firefly](/icons/adobe-firefly.md)
- [ByteDance](/icons/bytedance.md)
- [ComfyUI](/icons/comfyui.md)
- [DeepAI](/icons/deepai.md)
- [Krea](/icons/krea.md)
- [Luma](/icons/luma.md)
- [MiniMax](/icons/minimax.md)

## Browse the catalog
- Previous: [Kiro](/icons/kiro.md)
- Next: [Knex](/icons/knex.md)
- [All icons](/icons.md)