New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@lobehub/icons

Package Overview
Dependencies
Maintainers
2
Versions
121
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@lobehub/icons

Popular AI / LLM Model Brand SVG Logo and Icon Collection

  • 1.47.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
4.5K
decreased by-88.05%
Maintainers
2
Weekly downloads
 
Created
Source

Lobe Icons

Popular AI / LLM Model Brand SVG Logo and Icon Collection. See them all on one page at lobehub.com/icons.
Contributions, corrections & requests can be made on GitHub.

Documents · Changelog · Report Bug · Request Feature



Table of contents
TOC

✨ Features

  • 🚀 Lightweight & Scalable: Icons are designed to be lightweight, utilizing highly optimized scalable vector graphics (SVG) for the best performance and quality.
  • 🌳 Tree Shakable: The collection is tree-shakable, ensuring that you only import the icons that you use, which helps in reducing the overall bundle size of your project.
  • 👥 Active Community: Lobe Icons boasts an active community of designers and developers. Engage with us on platforms like GitHub and Discord to contribute or get support.

Supported brands:

ModelProviderApplication

Ai21Labs (Jamba)

01.AI (零一万物)

Adobe

Aya (Cohere)

Ai360 (360 智脑)

Automatic1111 (SD Webui)

Baichuan (百川)

AiMass (紫东太初)

ComfyUI

ChatGLM (智谱)

Alibaba

Firefly (Adobe)

Claude

AntGroup

Github Copilot

CodeGeeX

Anthropic

Google (Colab)

CogVideo

AWS

Hailuo (海螺)

CogView

Baidu

Kling (可灵)

DALL·E (OpenAI)

BaiduCloud (百度智能云)

Langfuse

DBRX (Databricks)

Bedrock (AWS)

Luma

DeepSeek

ByteDance

Microsoft Bing

Doubao (豆包)

Cloudflare

Microsoft Copilot

FishAudio (Bert)

Cohere (Command)

Midjourney

Flux (black forest labs)

DeepMind (Google)

Nvidia (ChatWithRTX)

Gemini (Google)

Fireworks

Pollinations

Gemma (Google)

GiteeAI

Qingyan (智谱清言)

Grok (xAI)

Github

Replit

Hunyuan (腾讯混元)

Google

Runway

LLaVA

Groq

Suno

Magic

Higress

Viggle

Minimax

HuggingFace

Zeabur

Mistral

InternLM

OpenChat

LM Studio

PaLM (Google)

LobeHub

Qwen (千问)

Meta

RWKV

Microsoft (Azure)

Spark (讯飞星火)

Moonshot (月之暗面)

Stepfun (阶跃星辰)

Novita

Wenxin (文心)

Ollama

Yi (零一万物)

OpenAI (ChatGPT)

OpenRouter

Perplexity

Replicate

SenseNova

SiliconCloud (SiliconFlow)

Stability (StableDiffusion)

Technology Innovation Institute (Falcon)

Tencent

together.ai

Upstage

VertexAI (Google)

vLLM

WorkersAI (Cloudflare)

xAI

Zhipu (智谱)

[!TIP]
More brands are being added, and PR welcome.

🤯 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:

A CDN with SVG

We provide a CDN service (@lobehub/icons-static-svg) which allows you to use SVG.

<!--UNPKG-->
<img height="64" src="https://unpkg.com/@lobehub/icons-static-svg@latest/icons/[ICON SLUG].svg" />

<!--ALIYUN-->
<img
  height="64"
  src="https://registry.npmmirror.com/@lobehub/icons-static-svg/latest/files/icons/[ICON SLUG].svg"
/>
Example
<!--UNPKG-->
<img height="64" src="https://unpkg.com/@lobehub/icons-static-svg@latest/icons/openai.svg" />

<!--ALIYUN-->
<img
  height="64"
  src="https://registry.npmmirror.com/@lobehub/icons-static-svg/latest/files/icons/openai.svg"
/>
<!--UNPKG-->
<img height="64" src="https://unpkg.com/@lobehub/icons-static-svg@latest/icons/openai-text.svg" />

<!--ALIYUN-->
<img
  height="64"
  src="https://registry.npmmirror.com/@lobehub/icons-static-svg/latest/files/icons/openai-text.svg"
/>

B CDN with PNG

We provide a CDN service (@lobehub/icons-static-png) which allows you to use PNG.

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

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

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

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

C CDN with WEBP

We provide a CDN service (@lobehub/icons-static-webp) which allows you to use WEBP.

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

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

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

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

Static Packages

PackageFileTypeVersion
@lobehub/icons-static-svgSVG
@lobehub/icons-static-pngPNG
@lobehub/icons-static-webpWEBP

📦 Installation

[!IMPORTANT]
This package is ESM only.

To install Lobe UI, run the following command:

$ bun add @lobehub/icons

Compile with NextJS

[!NOTE]
By work correct with nextjs ssr, add transpilePackages: ['@lobehub/icons'] to next.config.js. For example:

// next.config.js
const nextConfig = {
  // ...other config

  transpilePackages: ['@lobehub/icons'],
};

⌨️ Local Development

You can use Github Codespaces for online development:

Or clone it for local development:

$ git clone https://github.com/lobehub/lobe-icons.git
$ cd lobe-icons
$ bun install
$ bun start

🤝 Contributing

Contributions of all types are more than welcome, if you are interested in contributing code, feel free to check out our GitHub Issues to get stuck in to show us what you’re made of.

🩷 Sponsor

Every bit counts and your one-time donation sparkles in our galaxy of support! You're a shooting star, making a swift and bright impact on our journey. Thank you for believing in us – your generosity guides us toward our mission, one brilliant flash at a time.

More Products

  • 🤯 Lobe Chat - An open-source, extensible (Function Calling), high-performance chatbot framework. It supports one-click free deployment of your private ChatGPT/LLM web application.
  • 🅰️ Lobe Theme - The modern theme for stable diffusion webui, exquisite interface design, highly customizable UI, and efficiency boosting features.
  • 🧸 Lobe Vidol - Experience the magic of virtual idol creation with Lobe Vidol, enjoy the elegance of our Exquisite UI Design, dance along using MMD Dance Support, and engage in Smooth Conversations.

Design Resources

  • 🍭 Lobe UI - An open-source UI component library for building AIGC web apps.
  • 🥨 Lobe Icons - Popular AI / LLM Model Brand SVG Logo and Icon Collection.
  • 📊 Lobe Charts - React modern charts components built on recharts

Development Resources

  • 🎤 Lobe TTS - A high-quality & reliable TTS/STT library for Server and Browser
  • 🌏 Lobe i18n - Automation ai tool for the i18n (internationalization) translation process.

More Resources


📝 License

Copyright © 2023 LobeHub.
This project is MIT licensed.

Keywords

FAQs

Package last updated on 27 Nov 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc