1.2.6 • Published 1 year ago

@fablehenge/svelte-boring-avatars v1.2.6

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

Svelte-Boring-Avatars

NOTE > @fablehenge/svelte-boring-avatars is a fork of svelte-boring-avatars. Contains one fix to make typescript work with sveltkit-v2. Credit to this PR: https://github.com/paolotiu/svelte-boring-avatars/pull/6

Readme below here is from the upstream project.

Screenshot 2021-09-01 100049

A Svelte port of Boring Avatars.

Demo

REPL

Installation

npm install svelte-boring-avatars

# or

yarn add svelte-boring-avatars

Usage

<script lang="ts">
  import Avatar from "svelte-boring-avatars";
</script>

<Avatar
  size={40}
  name="Maria Mitchell"
  variant="marble"
  colors={["#92A1C6", "#146A7C", "#F0AB3D", "#C271B4", "#C20D90"]}
/>

Props

PropTypeDefault
sizenumber40
squarebooleanfalse
variant"bauhaus", "beam", "marble", "pixel", "ring", "sunset""marble"
colorsstring[]["#92A1C6", "#146A7C", "#F0AB3D", "#C271B4", "#C20D90"]

Reducing Bundle Size

This library is small as it is, but if you want to shave off some more load you can import a specific variant.

All the props stay the same except for the exclusion of variant.

<script>
  import { AvatarBeam } from "svelte-boring-avatars";
</script>

<AvatarBeam
  size={40}
  name="Maria Mitchell"
  colors={["#92A1C6", "#146A7C", "#F0AB3D", "#C271B4", "#C20D90"]}
/>
1.2.6

1 year ago