Image Upload Demo
Upload Image
Max 3 images | JPG/PNG only | Max 2MB per file
No images uploaded yet. Use the form above to upload your first image.
Automatic Image Variants
When you upload an image, the system automatically creates multiple resized versions:
- Thumbnail - 150x150px (zoom-crop to fill entire square, no distortion)
- Medium - 400x400px (maintains aspect ratio)
- Large - 800x800px (maintains aspect ratio)
These variants are stored in the database's variants JSON field and can be accessed programmatically.
How it works
- Select an image file using the file input
- The FileStorage behavior automatically processes the upload
- The ImageProcessor creates multiple resized versions (variants)
- File metadata and variant information are stored in the database
- The physical files are stored on disk using the configured path template
- Images are optimized to reduce file size
Path Structure
Original files:
FileStorage/images/{randomPath}/{id}/{filename}.{extension}
Variant files:
FileStorage/images/{randomPath}/{id}/{filename}.{hashedVariant}.{extension}
Technology Stack
- FlySystem - Storage abstraction layer
- Intervention Image - Image manipulation library
- Image Optimizer - Automatic file size optimization
