@usenavii/svelte

Svelte 5 components for deterministic inline SVG avatars and overlapping groups.

Install

npm i @usenavii/svelte

Svelte 5 is a peer dependency. The package retains @mhaadi/svg as a runtime dependency, so npm installs it automatically.

Usage

<script lang="ts">
  import { Navii, NaviiGroup } from '@usenavii/svelte';
</script>

<Navii seed={user.id} size={64} title={user.name} />
<NaviiGroup seeds={team.map(user => user.id)} size={48} max={5} />

Inline SVG is the default. Set as="img" for a data-URI image. Consume the package through a Svelte-aware bundler such as Vite or SvelteKit.