Statisches SVG

kubai-icons-static stellt jedes Icon als eigenständige SVG-Datei bereit. Die Farben sind in die Datei geschrieben, daher sind weder Skript noch Stylesheet nötig.

Installation

bash

npm install kubai-icons-static

Dateien

svg/ enthält jedes Icon im Standardblau (#5393FF). svg-soft/ enthält jedes Icon in der Variante „soft“, in Blaugrau.

Jede Datei enthält zusätzlichen Rand für den Schlagschatten. Um ein animiertes Icon in 24 px nachzubilden, zeigen Sie die Datei in 28 px an. Jede id in einer Datei enthält den Namen des Icons, sodass sich mehrere Icons auf einer Seite inline einbinden lassen.

CDN

Dateien direkt von einem CDN verwenden:

html

<img src="https://cdn.jsdelivr.net/npm/kubai-icons-static@0/svg/folder.svg" width="28" height="28" alt="" />

Beliebige Farbe

Die obigen Dateien gibt es in zwei Farben. Für eine andere Akzentfarbe fordern Sie das Icon per URL an. Das eignet sich auch für Agents und Tools, die keine Pakete installieren können.

html

<img src="https://icons.kubai.design/api/icon/folder.svg?color=EC4899" width="28" height="28" alt="" />

color: ein sechsstelliger Hex-Wert, mit oder ohne #. Standard: 5393FF.
variant: color oder soft.
badge: semantic oder ein Hex-Wert, für Icons mit Badge.
size: Breite und Höhe in Pixeln, von 16 bis 2048. Standard: 96.

Auf jsDelivr wird eine URL mit exakter Version langfristig zwischengespeichert. Eine URL mit Hauptversion, etwa @0, wird regelmäßig aktualisiert und übernimmt neue Releases.

Eigene Farben

Im Icon-Browser können Sie ein Icon in einer gewählten Farbe und Variante als SVG oder PNG herunterladen. Diese Dateien verwenden einfache Hex-Farben, die Designtools wie Figma korrekt lesen.

Metadaten

icons.json listet jedes Icon mit Kategorie und Tags auf, bei Icons mit Badge außerdem das Basis-Icon und das Badge. categories.json listet die Kategorien auf.