A simple avatar component for Svelte.

•

This component display an avatar image with fallback to the name initials. This component is inspired from react-user-avatar and vue-avatar.

Installation

npm install svelte-avatar

Note: Svelte 5 is required as a peer dependency.

Usage

with image:

<script>
  import { Avatar } from "svelte-avatar";
</script>

<Avatar name="John Walker" src="https://avatars0.githubusercontent.com/u/6810985?s=460&u=a2a24f33ad8d17377cef8163f596a7fbd1501cd4&v=4" />

with name:

<script>
  import { Avatar } from "svelte-avatar";
</script>

<Avatar name="John Walker" />

Prop

Build Setup

# install dependencies
npm install

# start docs dev server at localhost:5173
npm run dev

# build docs site
npm run build

# build the library (outputs to dist/)
npm run package

# preview the built docs site
npm run preview

Test

npm test

NPM Statistics

Download stats for this NPM package

License

Released under the MIT License.