Skip to content

Commit c4dd258

Browse files
Add missing provider logos from LobeHub and notable teams section
- Updated provider logo mapping to use LobeHub icon CDN for 40+ new providers (ai21, aleph_alpha, assemblyai, cloudflare, perplexity, together_ai, xai, etc.) - Kept LiteLLM repo logos for databricks and oracle (not on LobeHub) - Added notable teams logos to trust section: Adobe, Twilio, Zurich, Zapier, Rocket Money, Lemonade, The Weather Company, Samsara - Set provider avatar background to white for consistent icon visibility across light and dark themes (LobeHub icons use fill=currentColor) Co-authored-by: Ishaan Jaff <ishaan-jaff@users.noreply.github.com>
1 parent 243df3e commit c4dd258

4 files changed

Lines changed: 125 additions & 19 deletions

File tree

src/App.svelte

Lines changed: 49 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -340,6 +340,23 @@ We also need to update [${RESOURCE_BACKUP_NAME}](https://github.com/${REPO_FULL_
340340
<img class="trust-logo-img" src="https://github.com/user-attachments/assets/a6150c4c-149e-4cae-888b-8b92be6e003f" alt="OpenHands" height="28" />
341341
<span class="trust-logo-text">Netflix</span>
342342
<img class="trust-logo-img" src="https://github.com/user-attachments/assets/c02f7be0-8c2e-4d27-aea7-7c024bfaebc0" alt="OpenAI Agents SDK" height="28" />
343+
<img class="trust-logo-img trust-logo-svg" src="https://cdn.jsdelivr.net/npm/@lobehub/icons-static-svg@latest/icons/adobe-text.svg" alt="Adobe" height="28" />
344+
<span class="trust-logo-text trust-logo-icon">
345+
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.381-.008.008 5.352 0 11.971V12c0 6.64 5.359 12 12 12 6.64 0 12-5.36 12-12 0-6.641-5.36-12-12-12zm0 20.801c-4.846.015-8.786-3.904-8.801-8.75V12c-.014-4.846 3.904-8.786 8.75-8.801H12c4.847-.014 8.786 3.904 8.801 8.75V12c.015 4.847-3.904 8.786-8.75 8.801H12zm5.44-11.76c0 1.359-1.12 2.479-2.481 2.479-1.366-.007-2.472-1.113-2.479-2.479 0-1.361 1.12-2.481 2.479-2.481 1.361 0 2.481 1.12 2.481 2.481zm0 5.919c0 1.36-1.12 2.48-2.481 2.48-1.367-.008-2.473-1.114-2.479-2.48 0-1.359 1.12-2.479 2.479-2.479 1.361-.001 2.481 1.12 2.481 2.479zm-5.919 0c0 1.36-1.12 2.48-2.479 2.48-1.368-.007-2.475-1.113-2.481-2.48 0-1.359 1.12-2.479 2.481-2.479 1.358-.001 2.479 1.12 2.479 2.479zm0-5.919c0 1.359-1.12 2.479-2.479 2.479-1.367-.007-2.475-1.112-2.481-2.479 0-1.361 1.12-2.481 2.481-2.481 1.358 0 2.479 1.12 2.479 2.481z"/></svg>
346+
Twilio
347+
</span>
348+
<span class="trust-logo-text trust-logo-icon">
349+
<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="12"/><text x="12" y="16.5" text-anchor="middle" fill="white" font-size="13" font-weight="700" font-family="Arial,sans-serif">Z</text></svg>
350+
Zurich
351+
</span>
352+
<img class="trust-logo-img trust-logo-svg" src="https://cdn.jsdelivr.net/npm/@lobehub/icons-static-svg@latest/icons/zapier-text.svg" alt="Zapier" height="28" />
353+
<span class="trust-logo-text">Rocket Money</span>
354+
<span class="trust-logo-text" style="font-style: italic;">Lemonade</span>
355+
<span class="trust-logo-text trust-logo-icon">
356+
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M17.47 6.07a6.26 6.26 0 00-3.24-3.47A6.04 6.04 0 0011.32 2c-3.36 0-6.2 2.76-6.2 6.36a7.1 7.1 0 001.65 4.52L12 22l5.24-9.12a7.1 7.1 0 001.64-4.52c0-.77-.14-1.54-.41-2.29zM12 11.13a2.89 2.89 0 110-5.78 2.89 2.89 0 010 5.78z"/></svg>
357+
The Weather Company
358+
</span>
359+
<span class="trust-logo-text" style="font-weight: 300; letter-spacing: 0.15em;">samsara</span>
343360
</div>
344361
</div>
345362

@@ -809,6 +826,37 @@ curl http://0.0.0.0:4000/v1/chat/completions \
809826
letter-spacing: 0.04em;
810827
}
811828
829+
.trust-logo-icon {
830+
display: inline-flex;
831+
align-items: center;
832+
gap: 0.35rem;
833+
}
834+
835+
.trust-logo-icon svg {
836+
flex-shrink: 0;
837+
}
838+
839+
.trust-logo-svg {
840+
filter: brightness(0);
841+
opacity: 0.45;
842+
}
843+
844+
.trust-logo-svg:hover {
845+
filter: brightness(0);
846+
opacity: 0.8;
847+
}
848+
849+
@media (prefers-color-scheme: dark) {
850+
.trust-logo-svg {
851+
filter: brightness(0) invert(1);
852+
opacity: 0.5;
853+
}
854+
.trust-logo-svg:hover {
855+
filter: brightness(0) invert(1);
856+
opacity: 0.9;
857+
}
858+
}
859+
812860
/* Search Section */
813861
.search-section {
814862
max-width: 1400px;
@@ -1090,7 +1138,7 @@ curl http://0.0.0.0:4000/v1/chat/completions \
10901138
width: 28px;
10911139
height: 28px;
10921140
border-radius: 6px;
1093-
background-color: var(--bg-secondary);
1141+
background-color: #ffffff;
10941142
display: flex;
10951143
align-items: center;
10961144
justify-content: center;

src/ProviderDropdown.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -258,7 +258,7 @@
258258
height: 24px;
259259
border-radius: 50%;
260260
object-fit: contain;
261-
background-color: var(--bg-color);
261+
background-color: #ffffff;
262262
padding: 3px;
263263
flex-shrink: 0;
264264
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);

src/Providers.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -457,7 +457,7 @@
457457
458458
.provider-avatar {
459459
width: 40px; height: 40px; border-radius: 10px;
460-
background-color: var(--bg-secondary); display: flex; align-items: center;
460+
background-color: #ffffff; display: flex; align-items: center;
461461
justify-content: center; flex-shrink: 0; overflow: hidden;
462462
position: relative; padding: 6px; border: 1px solid var(--border-color);
463463
}

src/providers.ts

Lines changed: 74 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -33,49 +33,107 @@ export function getProviderInitial(provider: string): string {
3333
return provider.charAt(0).toUpperCase();
3434
}
3535

36+
const LOBEHUB_CDN = "https://cdn.jsdelivr.net/npm/@lobehub/icons-static-svg@latest/icons";
37+
const LITELLM_LOGOS = "https://raw.githubusercontent.com/BerriAI/litellm/main/ui/litellm-dashboard/public/assets/logos";
38+
3639
/**
37-
* Get the logo URL for a provider from the LiteLLM GitHub repository
38-
* Returns null if no logo is available for the provider
40+
* Get the logo URL for a provider.
41+
* Uses LobeHub icon CDN for most providers, falls back to LiteLLM repo for a few.
42+
* Returns null if no logo is available.
3943
*/
4044
export function getProviderLogo(provider: string): string | null {
4145
if (!provider) return null;
42-
43-
// Map provider names to their logo filenames in the LiteLLM repo (actual files from GitHub)
44-
const providerLogoMap: { [key: string]: string } = {
45-
"openai": "openai_small.svg",
46-
"azure": "microsoft_azure.svg",
46+
47+
const lobehubMap: { [key: string]: string } = {
48+
"openai": "openai.svg",
49+
"azure": "azure.svg",
50+
"azure_ai": "azureai.svg",
51+
"azure_text": "azure.svg",
4752
"anthropic": "anthropic.svg",
4853
"bedrock": "bedrock.svg",
54+
"bedrock_converse": "bedrock.svg",
4955
"vertex_ai": "google.svg",
5056
"vertexai": "google.svg",
5157
"cohere": "cohere.svg",
58+
"cohere_chat": "cohere.svg",
5259
"groq": "groq.svg",
5360
"mistral": "mistral.svg",
54-
"deepinfra": "deepinfra.png",
55-
"databricks": "databricks.svg",
61+
"deepinfra": "deepinfra.svg",
5662
"fireworks_ai": "fireworks.svg",
5763
"fireworks": "fireworks.svg",
5864
"ollama": "ollama.svg",
5965
"openrouter": "openrouter.svg",
6066
"deepseek": "deepseek.svg",
6167
"cerebras": "cerebras.svg",
62-
"oracle": "oracle.svg",
63-
"text-completion-openai": "openai_small.svg",
68+
"text-completion-openai": "openai.svg",
6469
"text-completion-codestral": "mistral.svg",
6570
"codestral": "mistral.svg",
6671
"sagemaker": "aws.svg",
6772
"aws": "aws.svg",
73+
"aws_polly": "aws.svg",
6874
"google": "google.svg",
6975
"gemini": "google.svg",
76+
"google_pse": "google.svg",
77+
"palm": "palm.svg",
78+
"ai21": "ai21.svg",
79+
"aleph_alpha": "alephalpha.svg",
80+
"anyscale": "anyscale.svg",
81+
"assemblyai": "assemblyai.svg",
82+
"cloudflare": "cloudflare.svg",
83+
"elevenlabs": "elevenlabs.svg",
84+
"exa_ai": "exa.svg",
85+
"fal_ai": "fal.svg",
86+
"featherless_ai": "featherless.svg",
87+
"friendliai": "friendli.svg",
88+
"github_copilot": "githubcopilot.svg",
89+
"huggingface": "huggingface.svg",
90+
"hyperbolic": "hyperbolic.svg",
91+
"jina_ai": "jina.svg",
92+
"lambda_ai": "lambda.svg",
93+
"meta_llama": "meta.svg",
94+
"minimax": "minimax.svg",
95+
"moonshot": "moonshot.svg",
96+
"morph": "morph.svg",
97+
"novita": "novita.svg",
98+
"nvidia_nim": "nvidia.svg",
99+
"perplexity": "perplexity.svg",
100+
"recraft": "recraft.svg",
101+
"replicate": "replicate.svg",
102+
"runwayml": "runway.svg",
103+
"sambanova": "sambanova.svg",
104+
"snowflake": "snowflake.svg",
105+
"stability": "stability.svg",
106+
"tavily": "tavily.svg",
107+
"together_ai": "together.svg",
108+
"v0": "v0.svg",
109+
"vercel_ai_gateway": "vercel.svg",
110+
"volcengine": "volcengine.svg",
111+
"voyage": "voyage.svg",
112+
"watsonx": "ibm.svg",
113+
"xai": "xai.svg",
114+
"zai": "zai.svg",
115+
"amazon_nova": "nova.svg",
116+
"chatgpt": "openai.svg",
117+
"dashscope": "alibaba.svg",
118+
};
119+
120+
const litellmMap: { [key: string]: string } = {
121+
"databricks": "databricks.svg",
122+
"oracle": "oracle.svg",
70123
};
71124

72125
const lowerProvider = provider.toLowerCase();
73-
const logoFilename = providerLogoMap[lowerProvider];
74-
75-
if (logoFilename) {
76-
return `https://raw.githubusercontent.com/BerriAI/litellm/main/ui/litellm-dashboard/public/assets/logos/${logoFilename}`;
126+
127+
const lobeFile = lobehubMap[lowerProvider];
128+
if (lobeFile) {
129+
return `${LOBEHUB_CDN}/${lobeFile}`;
77130
}
78-
131+
132+
const litellmFile = litellmMap[lowerProvider];
133+
if (litellmFile) {
134+
return `${LITELLM_LOGOS}/${litellmFile}`;
135+
}
136+
79137
return null;
80138
}
81139

0 commit comments

Comments
 (0)