<a name="readme-top"></a>

<div align="center">

<img height="120" src="https://registry.npmmirror.com/@lobehub/assets-logo/1.0.0/files/assets/logo-3d.webp">
<img height="120" src="https://gw.alipayobjects.com/zos/kitchen/qJ3l3EPsdW/split.png">
<img height="120" src="https://registry.npmmirror.com/@lobehub/fluent-emoji-3d/1.1.0/files/assets/1f968.webp">

# Lobe Icons

`Static Avatar`

Popular AI / LLM Model Brand SVG Logo and Icon Collection. See them all on one page at [icons.lobehub.com](https://icons.lobehub.com/).<br/>
Contributions, corrections & requests can be made on GitHub.

[Changelog](./CHANGELOG.md) · [Report Bug][github-issues-link] · [Request Feature][github-issues-link]

<!-- SHIELD GROUP -->

[![][npm-release-shield]][npm-release-link]
[![][vercel-shield]][vercel-link]
[![][discord-shield]][discord-link]
[![][npm-downloads-shield]][npm-downloads-link]<br/>
[![][github-releasedate-shield]][github-releasedate-link]
[![][github-action-test-shield]][github-action-test-link]
[![][github-action-release-shield]][github-action-release-link]<br/>
[![][github-contributors-shield]][github-contributors-link]
[![][github-forks-shield]][github-forks-link]
[![][github-stars-shield]][github-stars-link]
[![][github-issues-shield]][github-issues-link]
[![][github-license-shield]][github-license-link]

![](https://github.com/lobehub/lobe-icons/assets/17870709/7e2c56d2-d7ea-4cb8-842b-22de162d6486)

</div>

## 🤯 CDN Usage

Icons can be served from a CDN such as **unpkg** or **npmmirror (aliyun)**. Simply use the lobe icons npm package and specify a version in the URL like the following:

```html
<!--UNPKG-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="https://unpkg.com/@lobehub/icons-static-avatar@latest/dark/[ICON SLUG].png"
  />
  <img
    height="64"
    src="https://unpkg.com/@lobehub/icons-static-avatar@latest/light/[ICON SLUG].png"
  />
</picture>

<!--ALIYUN-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/dark/[ICON SLUG].png"
  />
  <img
    height="64"
    src="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/light/[ICON SLUG].png"
  />
</picture>
```

### Example

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/dark/openai.png">
  <img height="64" src="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/light/openai.png">
</picture>

```html
<!--UNPKG-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="https://unpkg.com/@lobehub/icons-static-avatar@latest/dark/open-ai.png"
  />
  <img height="64" src="https://unpkg.com/@lobehub/icons-static-avatar@latest/light/openai.png" />
</picture>

<!--ALIYUN-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="
      https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/dark/openai.png
    "
  />
  <img
    height="64"
    src="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/light/openai.png"
  />
</picture>
```

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/dark/open-ai-text.png">
  <img height="64" src="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/light/open-ai-text.png">
</picture>

```html
<!--UNPKG-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="https://unpkg.com/@lobehub/icons-static-avatar@latest/dark/openai-text.png"
  />
  <img
    height="64"
    src="https://unpkg.com/@lobehub/icons-static-avatar@latest/light/openai-text.png"
  />
</picture>

<!--ALIYUN-->
<picture>
  <source
    media="(prefers-color-scheme: dark)"
    srcset="
      https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/dark/openai-text.png
    "
  />
  <img
    height="64"
    src="https://registry.npmmirror.com/@lobehub/icons-static-avatar/latest/files/light/openai-text.png"
  />
</picture>
```

<div align="right">

[!\[\]\[back-to-top\]](#readme-top)

</div>

## 📦 Static Packages

| Package                                                                                    | FileType | Version                                                                                                                                                                                               |
| ------------------------------------------------------------------------------------------ | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [@lobehub/icons-static-svg](https://www.npmjs.com/package/@lobehub/icons-static-svg)       | `SVG`    | [![](https://img.shields.io/npm/v/@lobehub/icons-static-svg?color=369eff&labelColor=black&logo=npm&logoColor=white&style=flat-square)](https://www.npmjs.com/package/@lobehub/icons-static-svg)       |
| [@lobehub/icons-static-avatar](https://www.npmjs.com/package/@lobehub/icons-static-avatar) | `PNG`    | [![](https://img.shields.io/npm/v/@lobehub/icons-static-avatar?color=369eff&labelColor=black&logo=npm&logoColor=white&style=flat-square)](https://www.npmjs.com/package/@lobehub/icons-static-avatar) |
| [@lobehub/icons-static-webp](https://www.npmjs.com/package/@lobehub/icons-static-webp)     | `WEBP`   | [![](https://img.shields.io/npm/v/@lobehub/icons-static-webp?color=369eff&labelColor=black&logo=npm&logoColor=white&style=flat-square)](https://www.npmjs.com/package/@lobehub/icons-static-webp)     |

<div align="right">

[!\[\]\[back-to-top\]](#readme-top)

</div>

---

<details><summary><h4>📝 License</h4></summary>

[![][fossa-license-shield]][fossa-license-link]

</details>

Copyright © 2023 [LobeHub][profile-link]. <br />
This project is [MIT](./LICENSE) licensed.

<!-- LINK GROUP -->

[discord-link]: https://discord.gg/AYFPHvv2jT
[discord-shield]: https://img.shields.io/discord/1127171173982154893?color=5865F2&label=discord&labelColor=black&logo=discord&logoColor=white&style=flat-square
[fossa-license-link]: https://app.fossa.com/projects/git%2Bgithub.com%2Flobehub%2Flobe-icons
[fossa-license-shield]: https://app.fossa.com/api/projects/git%2Bgithub.com%2Flobehub%2Flobe-icons.png?type=large
[github-action-release-link]: https://github.com/actions/workflows/lobehub/lobe-icons/release.yml
[github-action-release-shield]: https://img.shields.io/github/actions/workflow/status/lobehub/lobe-icons/release.yml?label=release&labelColor=black&logo=githubactions&logoColor=white&style=flat-square
[github-action-test-link]: https://github.com/actions/workflows/lobehub/lobe-icons/test.yml
[github-action-test-shield]: https://img.shields.io/github/actions/workflow/status/lobehub/lobe-icons/test.yml?label=test&labelColor=black&logo=githubactions&logoColor=white&style=flat-square
[github-contributors-link]: https://github.com/lobehub/lobe-icons/graphs/contributors
[github-contributors-shield]: https://img.shields.io/github/contributors/lobehub/lobe-icons?color=c4f042&labelColor=black&style=flat-square
[github-forks-link]: https://github.com/lobehub/lobe-icons/network/members
[github-forks-shield]: https://img.shields.io/github/forks/lobehub/lobe-icons?color=8ae8ff&labelColor=black&style=flat-square
[github-issues-link]: https://github.com/lobehub/lobe-icons/issues
[github-issues-shield]: https://img.shields.io/github/issues/lobehub/lobe-icons?color=ff80eb&labelColor=black&style=flat-square
[github-license-link]: https://github.com/lobehub/lobe-icons/blob/master/LICENSE
[github-license-shield]: https://img.shields.io/github/license/lobehub/lobe-icons?color=white&labelColor=black&style=flat-square
[github-releasedate-link]: https://github.com/lobehub/lobe-icons/releases
[github-releasedate-shield]: https://img.shields.io/github/release-date/lobehub/lobe-icons?labelColor=black&style=flat-square
[github-stars-link]: https://github.com/lobehub/lobe-icons/network/stargazers
[github-stars-shield]: https://img.shields.io/github/stars/lobehub/lobe-icons?color=ffcb47&labelColor=black&style=flat-square
[npm-downloads-link]: https://www.npmjs.com/package/@lobehub/icons-static-avatar
[npm-downloads-shield]: https://img.shields.io/npm/dt/@lobehub/icons-static-avatar?labelColor=black&style=flat-square
[npm-release-link]: https://www.npmjs.com/package/@lobehub/icons-static-avatar
[npm-release-shield]: https://img.shields.io/npm/v/@lobehub/icons-static-avatar?color=369eff&labelColor=black&logo=npm&logoColor=white&style=flat-square
[profile-link]: https://github.com/lobehub
[vercel-link]: https://icons.lobehub.com
[vercel-shield]: https://img.shields.io/website?down_message=offline&label=vercel&labelColor=black&logo=vercel&style=flat-square&up_message=online&url=https%3A%2F%2Fui.lobehub.com
