https://github.com/alekoii/svelte-boring-avatars
Svelte port of Boring Avatars Beam Component
https://github.com/alekoii/svelte-boring-avatars
boring-avatars svelte sveltekit
Last synced: 6 months ago
JSON representation
Svelte port of Boring Avatars Beam Component
- Host: GitHub
- URL: https://github.com/alekoii/svelte-boring-avatars
- Owner: Alekoii
- Created: 2024-11-01T16:11:19.000Z (11 months ago)
- Default Branch: master
- Last Pushed: 2024-11-01T16:11:39.000Z (11 months ago)
- Last Synced: 2025-03-24T11:11:15.675Z (7 months ago)
- Topics: boring-avatars, svelte, sveltekit
- Language: Svelte
- Homepage: https://svelte-boring-avatars.vercel.app
- Size: 48.8 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# BeamAvatar Component
BeamAvatar is a customizable avatar component for Svelte, inspired by [Boring Avatars](https://github.com/boringdesigners/boring-avatars). It generates unique and consistent avatars based on usernames and custom color palettes.
## Installation
```bash
# Clone and copy BeamAvatar.svelte into your project
cp BeamAvatar.svelte src/components/
```
## Basic Usage
```svelte
import BeamAvatar from './BeamAvatar.svelte';
```
## Props
| Prop | Type | Default | Description |
| ------ | -------- | ------------------------------------------------------- | ------------------------------------- |
| name | string | 'Biricato' | Text used to generate the avatar |
| colors | string[] | ['#fe4365', '#fc9d9a', '#f9cdad', '#c8c8a9', '#83af9b'] | Array of 5 colors used for the avatar |
| size | number | 36 | Size of the avatar in pixels |
| square | boolean | false | Whether to render a square avatar |
| title | string | undefined | Optional title attribute for the SVG |
## Examples
### Basic Avatar
```svelte
```
### Custom Size
```svelte
```
### Custom Colors
```svelte
```
### Square Avatar
```svelte
```
### With Title
```svelte
```
## Credits
This component is inspired by [Boring Avatars](https://github.com/boringdesigners/boring-avatars) created by Hayk An, Javi Sánchez-Marín, Enric Pallerols and Josep Martins.
The default color palettes are from [Nice Color Palettes](https://github.com/Jam3/nice-color-palettes) by Matt DesLauriers.
## License
MIT License - Feel free to use this component in your projects.