@yldm-tech/ai-logo 1.2.4 → 1.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +38 -85
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -40,6 +40,7 @@ Contributions, corrections & requests can be made on GitHub.
|
|
|
40
40
|
- [`A` CDN with SVG](#a-cdn-with-svg)
|
|
41
41
|
- [`B` CDN with PNG](#b-cdn-with-png)
|
|
42
42
|
- [`C` CDN with WEBP](#c-cdn-with-webp)
|
|
43
|
+
- [Pinning a version](#pinning-a-version)
|
|
43
44
|
- [Asset Paths](#asset-paths)
|
|
44
45
|
- [⌨️ Local Development](#️-local-development)
|
|
45
46
|
- [🤝 Contributing](#-contributing)
|
|
@@ -258,37 +259,26 @@ Static SVG, PNG and WebP renders of every icon live in this repository under `pa
|
|
|
258
259
|
|
|
259
260
|
## 🤯 CDN Usage
|
|
260
261
|
|
|
261
|
-
Every icon is
|
|
262
|
-
|
|
263
|
-
Replace `@main` with a release tag such as `@v1.0.0` to pin the assets to a fixed version.
|
|
262
|
+
Every icon is served as a static SVG, PNG and WebP render from `ailogo.yldm.ai`. No install, no build step — just an `<img>` tag.
|
|
264
263
|
|
|
265
264
|
### `A` CDN with SVG
|
|
266
265
|
|
|
267
266
|
```html
|
|
268
|
-
<img
|
|
269
|
-
height="64"
|
|
270
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-svg/icons/[ICON SLUG].svg"
|
|
271
|
-
/>
|
|
267
|
+
<img height="64" src="https://ailogo.yldm.ai/svg/[ICON SLUG].svg" />
|
|
272
268
|
```
|
|
273
269
|
|
|
274
270
|
#### Example
|
|
275
271
|
|
|
276
|
-
<img height="64" src="https://
|
|
272
|
+
<img height="64" src="https://ailogo.yldm.ai/svg/openai.svg">
|
|
277
273
|
|
|
278
274
|
```html
|
|
279
|
-
<img
|
|
280
|
-
height="64"
|
|
281
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-svg/icons/openai.svg"
|
|
282
|
-
/>
|
|
275
|
+
<img height="64" src="https://ailogo.yldm.ai/svg/openai.svg" />
|
|
283
276
|
```
|
|
284
277
|
|
|
285
|
-
<img height="64" src="https://
|
|
278
|
+
<img height="64" src="https://ailogo.yldm.ai/svg/openai-text.svg">
|
|
286
279
|
|
|
287
280
|
```html
|
|
288
|
-
<img
|
|
289
|
-
height="64"
|
|
290
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-svg/icons/openai-text.svg"
|
|
291
|
-
/>
|
|
281
|
+
<img height="64" src="https://ailogo.yldm.ai/svg/openai-text.svg" />
|
|
292
282
|
```
|
|
293
283
|
|
|
294
284
|
<div align="right">
|
|
@@ -305,52 +295,26 @@ PNG renders come in light and dark variants, so a `<picture>` element can follow
|
|
|
305
295
|
<picture>
|
|
306
296
|
<source
|
|
307
297
|
media="(prefers-color-scheme: dark)"
|
|
308
|
-
srcset="https://
|
|
309
|
-
/>
|
|
310
|
-
<img
|
|
311
|
-
height="64"
|
|
312
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/light/[ICON SLUG].png"
|
|
298
|
+
srcset="https://ailogo.yldm.ai/png/dark/[ICON SLUG].png"
|
|
313
299
|
/>
|
|
300
|
+
<img height="64" src="https://ailogo.yldm.ai/png/light/[ICON SLUG].png" />
|
|
314
301
|
</picture>
|
|
315
302
|
```
|
|
316
303
|
|
|
317
304
|
#### Example
|
|
318
305
|
|
|
319
306
|
<picture>
|
|
320
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://
|
|
321
|
-
<img height="64" src="https://
|
|
322
|
-
</picture>
|
|
323
|
-
|
|
324
|
-
```html
|
|
325
|
-
<picture>
|
|
326
|
-
<source
|
|
327
|
-
media="(prefers-color-scheme: dark)"
|
|
328
|
-
srcset="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/dark/openai.png"
|
|
329
|
-
/>
|
|
330
|
-
<img
|
|
331
|
-
height="64"
|
|
332
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/light/openai.png"
|
|
333
|
-
/>
|
|
334
|
-
</picture>
|
|
335
|
-
```
|
|
336
|
-
|
|
337
|
-
<picture>
|
|
338
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/dark/openai-text.png">
|
|
339
|
-
<img height="64" src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/light/openai-text.png">
|
|
307
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://ailogo.yldm.ai/png/dark/openai.png">
|
|
308
|
+
<img height="64" src="https://ailogo.yldm.ai/png/light/openai.png">
|
|
340
309
|
</picture>
|
|
341
310
|
|
|
342
311
|
```html
|
|
343
312
|
<picture>
|
|
344
313
|
<source
|
|
345
314
|
media="(prefers-color-scheme: dark)"
|
|
346
|
-
srcset="
|
|
347
|
-
https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/dark/openai-text.png
|
|
348
|
-
"
|
|
349
|
-
/>
|
|
350
|
-
<img
|
|
351
|
-
height="64"
|
|
352
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-png/light/openai-text.png"
|
|
315
|
+
srcset="https://ailogo.yldm.ai/png/dark/openai.png"
|
|
353
316
|
/>
|
|
317
|
+
<img height="64" src="https://ailogo.yldm.ai/png/light/openai.png" />
|
|
354
318
|
</picture>
|
|
355
319
|
```
|
|
356
320
|
|
|
@@ -368,55 +332,44 @@ WebP renders are the smallest of the three and also ship light and dark variants
|
|
|
368
332
|
<picture>
|
|
369
333
|
<source
|
|
370
334
|
media="(prefers-color-scheme: dark)"
|
|
371
|
-
srcset="https://
|
|
372
|
-
/>
|
|
373
|
-
<img
|
|
374
|
-
height="64"
|
|
375
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-webp/light/[ICON SLUG].webp"
|
|
335
|
+
srcset="https://ailogo.yldm.ai/webp/dark/[ICON SLUG].webp"
|
|
376
336
|
/>
|
|
337
|
+
<img height="64" src="https://ailogo.yldm.ai/webp/light/[ICON SLUG].webp" />
|
|
377
338
|
</picture>
|
|
378
339
|
```
|
|
379
340
|
|
|
380
341
|
#### Example
|
|
381
342
|
|
|
382
343
|
<picture>
|
|
383
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://
|
|
384
|
-
<img height="64" src="https://
|
|
344
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://ailogo.yldm.ai/webp/dark/openai.webp">
|
|
345
|
+
<img height="64" src="https://ailogo.yldm.ai/webp/light/openai.webp">
|
|
385
346
|
</picture>
|
|
386
347
|
|
|
387
348
|
```html
|
|
388
349
|
<picture>
|
|
389
350
|
<source
|
|
390
351
|
media="(prefers-color-scheme: dark)"
|
|
391
|
-
srcset="
|
|
392
|
-
https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-webp/dark/openai.webp
|
|
393
|
-
"
|
|
394
|
-
/>
|
|
395
|
-
<img
|
|
396
|
-
height="64"
|
|
397
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-webp/light/openai.webp"
|
|
352
|
+
srcset="https://ailogo.yldm.ai/webp/dark/openai.webp"
|
|
398
353
|
/>
|
|
354
|
+
<img height="64" src="https://ailogo.yldm.ai/webp/light/openai.webp" />
|
|
399
355
|
</picture>
|
|
400
356
|
```
|
|
401
357
|
|
|
402
|
-
<
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
358
|
+
<div align="right">
|
|
359
|
+
|
|
360
|
+
[![][back-to-top]](#readme-top)
|
|
361
|
+
|
|
362
|
+
</div>
|
|
363
|
+
|
|
364
|
+
### Pinning a version
|
|
365
|
+
|
|
366
|
+
`ailogo.yldm.ai` always serves what is on `main`. To pin the assets to a release instead, take the same files from jsDelivr against a tag:
|
|
406
367
|
|
|
407
368
|
```html
|
|
408
|
-
<
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-webp/dark/openai-text.webp
|
|
413
|
-
"
|
|
414
|
-
/>
|
|
415
|
-
<img
|
|
416
|
-
height="64"
|
|
417
|
-
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@main/packages/static-webp/light/openai-text.webp"
|
|
418
|
-
/>
|
|
419
|
-
</picture>
|
|
369
|
+
<img
|
|
370
|
+
height="64"
|
|
371
|
+
src="https://cdn.jsdelivr.net/gh/yldm-tech/ai-logo@v1.2.3/packages/static-svg/icons/openai.svg"
|
|
372
|
+
/>
|
|
420
373
|
```
|
|
421
374
|
|
|
422
375
|
<div align="right">
|
|
@@ -427,12 +380,12 @@ WebP renders are the smallest of the three and also ship light and dark variants
|
|
|
427
380
|
|
|
428
381
|
### Asset Paths
|
|
429
382
|
|
|
430
|
-
| Format
|
|
431
|
-
|
|
|
432
|
-
| `SVG`
|
|
433
|
-
| `PNG`
|
|
434
|
-
| `WEBP`
|
|
435
|
-
| `
|
|
383
|
+
| Format | Path | Variants |
|
|
384
|
+
| -------- | -------------------------- | ------------------------------ |
|
|
385
|
+
| `SVG` | `/svg/[ICON SLUG].svg` | single file, `-color` suffixed |
|
|
386
|
+
| `PNG` | `/png/{light,dark}/…png` | light / dark |
|
|
387
|
+
| `WEBP` | `/webp/{light,dark}/…webp` | light / dark |
|
|
388
|
+
| `Avatar` | `/avatar/[ICON SLUG].webp` | square avatars |
|
|
436
389
|
|
|
437
390
|
The icon slug is the component name in kebab-case — `OpenAI` becomes `openai`, `AdobeFirefly` becomes `adobe-firefly`. Icons that have a colour variant expose it with a `-color` suffix.
|
|
438
391
|
|