How to Generate Thumbnails in Laravel Using Spatie Image

Ultimate way to generate thumbnail in Laravel - Spatie/Image (2025)

Thumbnails plays a crucial role in modern applications - whether it's an e-commerce website or a media gallery, blog or a dashboard. Thumbnail helps in reducing load time, provides better UI and consistency and enhance overall user experience.

In Laravel, generating thumbnail images is super easy thanks to the Spatie Image package. This packages is a powerful tool when it comes to image manipulation with easy and expressive syntax.

In this blog we will explore how to generate thumbnails using Spatie Image package, along with multiple examples and real world use cases.

🌟 Introduction

Whenever users upload photos — product images, profile pictures, blog banners, or gallery items — serving the original full-size image can slow down your app dramatically because the image size might be too large and high resolution and its not necessary to show the original image as thumbnail image. That’s where thumbnails come in.

Thumbnails are:

lightweight 🪶

fast to load ⚡

ideal for listing pages 🔍

easier to cache

helpful for improving the page speed

Instead of manually resizing images, Laravel + Spatie Image lets you automatically create thumbnails with just a few lines of code.

📦 Installation

You can checkout our detailed installation tutorial here:

👉 https://www.thedevnerd.com/2025/11/Image-manipulation-in-laravel-using-spatie.html

So in this blog, we’ll directly jump into implementation! 🚀

🟦 1. Basic Thumbnail Generation

This example creates a 300×300 thumbnail and saves it separately.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation()
    {
        $source = storage_path('app/public/images/building.jpg');
        $destination = storage_path('app/public/images/photo-updated.jpg');

        Image::load($source)
            ->width(300)
            ->height(300)
            ->save($destination);

        $newImage = 'photo-updated.jpg';

        return view('spatie-image', compact('newImage'));
    }
}

🟩 2. Creating a Thumbnail While Maintaining Aspect Ratio

Instead of stretching, you can set only width or height.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation()
    {
        $source = storage_path('app/public/images/building.jpg');
        $destination = storage_path('app/public/images/photo-updated.jpg');

        Image::load($source)
            ->width(400)
            ->save($destination);

        $newImage = 'photo-updated.jpg';

        return view('spatie-image', compact('newImage'));
    }
}

🟨 3. Cropped Square Thumbnails (Common for Profiles)

Many platforms use square thumbnails. Here’s how to crop a perfect square:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation()
    {
        $source = storage_path('app/public/images/building.jpg');
        $destination = storage_path('app/public/images/photo-updated.jpg');

        Image::load($source)
            ->crop(300, 300)
            ->save($destination);

        $newImage = 'photo-updated.jpg';

        return view('spatie-image', compact('newImage'));
    }
}

🟧 4. Thumbnail + Compression (Best for Performance)

You can also reduce file size while generating a thumbnail:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation()
    {
        $source = storage_path('app/public/images/building.jpg');
        $destination = storage_path('app/public/images/photo-updated.jpg');

        Image::load($source)
            ->width(400)
            ->height(250)
            ->quality(70)
            ->save($destination);

        $newImage = 'photo-updated.jpg';

        return view('spatie-image', compact('newImage'));
    }
}

🟥 5. Multiple Thumbnail Sizes at Once

Useful when you need:

small thumbnails (list view)

medium thumbnails (grid view)

large preview images

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation()
    {
        $source = public_path('uploads/main.jpg');

        $sizes = [
            'small' => [150, 150],
            'medium' => [300, 200],
            'large' => [600, 400],
        ];

        foreach ($sizes as $name => [$w, $h]) {
            Image::load($source)
                ->width($w)
                ->height($h)
                ->save(public_path("uploads/thumb-{$name}.jpg"));
        }
        dd('Thumbnails created successfully!');
    }
}

🟪 6. Thumbnail Generation After File Upload (Real Use Case)

Here’s a real-world controller example generating a thumbnail right after a user uploads an image:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Image\Image;

class HomeController extends Controller
{
    public function showImageManipulation(Request $request)
    {
        $request->validate([
            'image' => 'required|image|max:5000',
        ]);

        $path = $request->file('image')->store('uploads', 'public');

        $fullPath = public_path('storage/' . $path);
        $thumbnailPath = public_path('storage/uploads/thumb-' . basename($path));

        Image::load($fullPath)
            ->width(300)
            ->height(300)
            ->save($thumbnailPath);

        return response()->json([
            'original' => asset('storage/' . $path),
            'thumbnail' => asset('storage/uploads/thumb-' . basename($path)),
        ]);
    }
}