# Svelte avatar library: using DiceBear with Svelte DiceBear works with both Svelte 4 and Svelte 5. Use `$derived` (Svelte 5) or reactive statements (Svelte 4) to keep SVG profile pictures in sync with prop changes, either via the JS library for client-side generation or the HTTP API for a zero-dependency approach. You can use DiceBear with Svelte either via the [JS-Library](https://www.dicebear.com/how-to-use/js-library/) or the [HTTP-API](https://www.dicebear.com/how-to-use/http-api/). ## With the JS library ```svelte [Svelte 5] ``` ```svelte [Svelte 4] ``` ## With the HTTP API ```svelte [Svelte 5] ``` ```svelte [Svelte 4] ```