# Avatars

When file uploads are enabled, Account UI provides avatar upload functionality.

## Enabling

In `quickback.config.ts`:

```ts
account: {
  fileUploads: true,
  // ...
}
```

The compiler emits `VITE_ENABLE_FILE_UPLOADS=true` into the Account SPA's build env.

## Upload Flow

1. User clicks their profile picture
2. Image picker opens (supports JPG, PNG, WebP)
3. Image is cropped to square
4. Uploaded to R2/S3 storage
5. Profile updated with new avatar URL

## Requirements

- `account.fileUploads: true`
- R2 bucket or S3-compatible storage configured
- Upload endpoints available in your API

## Related

- [R2 Storage](/platform/storage/r2) — File storage setup
- [Environment Variables](/ui/account/environment-variables)