Summary
- Cells rendered
- 469
- Total generation time
- 0 ms
- Peak memory
- 12.00 MB
Basic
original
$image
{{ image|img }}
image.jpg
→ 1000×667
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
crop center
$image->crop(800, 300)
{{ image|crop(800, 300)|img }}
landscape/fermin-rodriguez-penelas.jpg
→ 800×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
crop top
$image->crop(800, 300, CropPosition::Top)
{{ image|crop(800, 300, enum('Timber\\Chainsaw\\Enum\\CropPosition').Top)|img }}
landscape/fermin-rodriguez-penelas.jpg
→ 800×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
crop bottom
$image->crop(800, 300, CropPosition::Bottom)
{{ image|crop(800, 300, enum('Timber\\Chainsaw\\Enum\\CropPosition').Bottom)|img }}
landscape/fermin-rodriguez-penelas.jpg
→ 800×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
crop left
$image->crop(400, 800, CropPosition::Left)
{{ image|crop(400, 800, enum('Timber\\Chainsaw\\Enum\\CropPosition').Left)|img }}
landscape/fermin-rodriguez-penelas.jpg
→ 400×800
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
crop right
$image->crop(400, 800, CropPosition::Right)
{{ image|crop(400, 800, enum('Timber\\Chainsaw\\Enum\\CropPosition').Right)|img }}
landscape/fermin-rodriguez-penelas.jpg
→ 400×800
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
contain
$image->contain(500, 200)
{{ image|manipulate({contain: [500, 200]})|img }}
image.jpg
→ 300×200
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
pad
$image->pad(400, 400, '#3b82f6')
{{ image|manipulate({pad: [400, 400, '#3b82f6']})|img }}
image.jpg
→ 400×400
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
stretch
$image->stretch(300, 300)
{{ image|manipulate({stretch: [300, 300]})|img }}
image.jpg
→ 300×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
focalCrop
$image->focalCrop(400, 300, 0.3, 0.2)
{{ image|manipulate({focalCrop: [400, 300, 0.3, 0.2]})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
cropAt
$image->cropAt(100, 50, 400, 300)
{{ image|manipulate({cropAt: [100, 50, 400, 300]})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
orientation
$image->orientation(Orientation::Rotate90)
{{ image|manipulate({orientation: enum('Timber\\Chainsaw\\Enum\\Orientation').Rotate90})|img }}
image.jpg
→ 667×1000
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Effects
blur(20)
$image->crop(400, 300)->blur(20)
{{ image|crop(400, 300)|blur(20)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
sharpen(50)
$image->crop(400, 300)->sharpen(50)
{{ image|crop(400, 300)|sharpen(50)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
greyscale
$image->crop(400, 300)->greyscale()
{{ image|crop(400, 300)|greyscale|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
sepia
$image->crop(400, 300)->sepia()
{{ image|crop(400, 300)|sepia|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
brightness +30
$image->crop(400, 300)->brightness(30)
{{ image|crop(400, 300)|brightness(30)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
brightness -30
$image->crop(400, 300)->brightness(-30)
{{ image|crop(400, 300)|brightness(-30)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
contrast(30)
$image->crop(400, 300)->contrast(30)
{{ image|crop(400, 300)|contrast(30)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
gamma(2.0)
$image->crop(400, 300)->gamma(2)
{{ image|crop(400, 300)|gamma(2)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
pixelate(10)
$image->crop(400, 300)->pixelate(10)
{{ image|crop(400, 300)|pixelate(10)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
border overlay
$image->crop(400, 300)->border(10, color: '#ff0000')
{{ image|manipulate({crop: [400, 300], border: {0: 10, color: '#ff0000'}})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
border expand
$image->crop(400, 300)->border(20, color: '#22c55e', type: BorderType::Expand)
{{ image|manipulate({crop: [400, 300], border: {0: 20, color: '#22c55e', type: enum('Timber\\Chainsaw\\Enum\\BorderType').Expand}})|img }}
image.jpg
→ 440×340
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
flip H
$image->crop(400, 300)->flip(FlipDirection::Horizontal)
{{ image|manipulate({crop: [400, 300], flip: enum('Timber\\Chainsaw\\Enum\\FlipDirection').Horizontal})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Encoding
webp
$image->crop(400, 300)->format(Format::Webp)
{{ image|crop(400, 300)|format(enum('Timber\\Chainsaw\\Enum\\Format').Webp)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
quality 20
$image->crop(400, 300)->quality(20)
{{ image|crop(400, 300)|quality(20)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
quality 95
$image->crop(400, 300)->quality(95)
{{ image|crop(400, 300)|quality(95)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
optimize
$image->crop(400, 300)->optimize(true)
{{ image|crop(400, 300)|optimize(true)|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Presets
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
PNG
PNG crop
$image->crop(200, 200)
{{ image|crop(200, 200)|img }}
timber-tree-green.png
→ 200×200
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
PNG → WebP
$image->crop(200, 200)->format(Format::Webp)
{{ image|crop(200, 200)|format(enum('Timber\\Chainsaw\\Enum\\Format').Webp)|img }}
timber-tree-green.png
→ 200×200
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
PNG + bg
$image->crop(200, 200)->background('#ff6600')
{{ image|crop(200, 200)|background('#ff6600')|img }}
timber-tree-green.png
→ 200×200
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
GIF
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
static GIF → WebP
$image->crop(300, 300)->format(Format::Webp)
{{ image|crop(300, 300)|format(enum('Timber\\Chainsaw\\Enum\\Format').Webp)|img }}
github.gif
→ 300×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
animated GIF
$image
{{ image|img }}
timber.gif
→ 480×480
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
animated GIF → GIF
$image->width(240)->format(Format::Gif)
{{ image|width(240)|format(enum('Timber\\Chainsaw\\Enum\\Format').Gif)|img }}
timber.gif
→ 240×240
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
animated GIF → WebP
$image->width(240)->format(Format::Webp)
{{ image|width(240)|format(enum('Timber\\Chainsaw\\Enum\\Format').Webp)|img }}
timber.gif
→ 240×240
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
animated GIF → AVIF
$image->width(240)->format(Format::Avif)
{{ image|width(240)|format(enum('Timber\\Chainsaw\\Enum\\Format').Avif)|img }}
timber.gif
→ 240×240
intervention-gd
0 ms
12.00 MB
intervention-imagick
Errored: ImagickException: Failed to get the image contents (empty or invalid image?)
Watermark
bottom-right
$image->crop(600, 400)->watermark('timber-tree-green.png', Position::BottomRight, paddingX: 10, paddingY: 10, width: 80)
{{ image|manipulate({crop: [600, 400], watermark: {0: 'timber-tree-green.png', 1: enum('Timber\\Chainsaw\\Enum\\Position').BottomRight, paddingX: 10, paddingY: 10, width: 80}})|img }}
image.jpg
→ 600×400
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
center 40%
$image->crop(600, 400)->watermark('timber-tree-green.png', Position::Center, width: 150, alpha: 40)
{{ image|manipulate({crop: [600, 400], watermark: {0: 'timber-tree-green.png', 1: enum('Timber\\Chainsaw\\Enum\\Position').Center, width: 150, alpha: 40}})|img }}
image.jpg
→ 600×400
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
top-left
$image->crop(600, 400)->watermark('timber-tree-green.png', Position::TopLeft, paddingX: 10, paddingY: 10, width: 60)
{{ image|manipulate({crop: [600, 400], watermark: {0: 'timber-tree-green.png', 1: enum('Timber\\Chainsaw\\Enum\\Position').TopLeft, paddingX: 10, paddingY: 10, width: 60}})|img }}
image.jpg
→ 600×400
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
without(Watermark)
$image->crop(400, 300)->watermark('timber-tree-green.png', Position::BottomRight, paddingX: 10, paddingY: 10, width: 60)->without(Watermark::class)
{{ image|manipulate({crop: [400, 300], watermark: {0: 'timber-tree-green.png', 1: enum('Timber\\Chainsaw\\Enum\\Position').BottomRight, paddingX: 10, paddingY: 10, width: 60}, without: 'Timber\\Chainsaw\\Manipulator\\Watermark'})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Dithering
Atkinson 200
$image->crop(200, 150)->dither()
{{ image|manipulate({crop: [200, 150], dither: []})|img }}
image.jpg
→ 200×150
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Floyd-Steinberg 200
$image->crop(200, 150)->dither(DitherAlgorithm::FloydSteinberg)
{{ image|manipulate({crop: [200, 150], dither: enum('Timber\\Chainsaw\\Enum\\DitherAlgorithm').FloydSteinberg})|img }}
image.jpg
→ 200×150
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Atkinson 400
$image->crop(400, 300)->dither()
{{ image|manipulate({crop: [400, 300], dither: []})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Floyd-Steinberg 400
$image->crop(400, 300)->dither(DitherAlgorithm::FloydSteinberg)
{{ image|manipulate({crop: [400, 300], dither: enum('Timber\\Chainsaw\\Enum\\DitherAlgorithm').FloydSteinberg})|img }}
image.jpg
→ 400×300
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
BlurHash
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
BlurHash 64×64
$image->blurhash(width: 64, height: 64)
{{ image|manipulate({blurhash: {width: 64, height: 64}})|img }}
image.jpg
→ 64×64
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
BlurHash 4×3
$image->blurhash(width: 4, height: 3)
{{ image|manipulate({blurhash: {width: 4, height: 3}})|img }}
image.jpg
→ 4×3
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
BlurHash 6×4 comps
$image->blurhash(componentsX: 6, componentsY: 4)
{{ image|manipulate({blurhash: {componentsX: 6, componentsY: 4}})|img }}
image.jpg
→ 32×32
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Responsive
widths 200/400/800
$image->crop(400, 300)->widths(200, 400, 800)
{{ image|crop(400, 300)|widths(200, 400, 800)|img({sizes: '(min-width: 800px) 800px, 100vw'}) }}
image.jpg
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
widthsBetween 200–800 step 200
$image->crop(400, 300)->widthsBetween(200, 800, 200)
{{ image|manipulate({crop: [400, 300], widthsBetween: [200, 800, 200]})|img }}
image.jpg
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
dpr 2×
$image->crop(400, 300)->dpr(2)
{{ image|manipulate({crop: [400, 300], dpr: 2})|img }}
image.jpg
intervention-gd
Unsupported
intervention-imagick
Unsupported
autoDpr
$image->crop(400, 300)->autoDpr()
{{ image|manipulate({crop: [400, 300], autoDpr: []})|img }}
image.jpg
intervention-gd
Unsupported
intervention-imagick
Unsupported
autoWidth
$image->crop(400, 300)->autoWidth()
{{ image|manipulate({crop: [400, 300], autoWidth: []})|img }}
image.jpg
intervention-gd
Unsupported
intervention-imagick
Unsupported
saveData
$image->crop(400, 300)->saveData()
{{ image|manipulate({crop: [400, 300], saveData: []})|img }}
image.jpg
intervention-gd
Unsupported
intervention-imagick
Unsupported
art direction
Picture::fallback($image->crop(400, 400))
->at('(min-width: 768px)', $image->crop(800, 300))
->formats(Format::Webp)
{{ image|picture({'(min-width: 768px)': {crop: [800, 300]}}, [enum('Timber\\Chainsaw\\Enum\\Format').Webp])|img }}
image.jpg
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
Data URI
inline 100×100
$image->crop(100, 100)->toDataUri()
{{ image|crop(100, 100)|toDataUri }}
image.jpg
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
imgproxy
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
imagor
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
thumbor
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
wserv
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
cloudflare
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
imgproxy
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
imagor
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
thumbor
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
wserv
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
cloudflare
Errored: Timber\Chainsaw\Exception\DriverException: toDataUri() requires a local driver (e.g., InterventionDriver). URL-grammar drivers cannot generate image bytes.
Complex
grey+contrast+sharpen+WM+webp+q90
$image->crop(600, 400)->greyscale()->contrast(20)->sharpen(30)->watermark('timber-tree-green.png', Position::BottomRight, paddingX: 10, paddingY: 10, width: 80, alpha: 70)->format(Format::Webp)->quality(90)
{{ image|manipulate({crop: [600, 400], greyscale: [], contrast: 20, sharpen: 30, watermark: {0: 'timber-tree-green.png', 1: enum('Timber\\Chainsaw\\Enum\\Position').BottomRight, paddingX: 10, paddingY: 10, width: 80, alpha: 70}, format: enum('Timber\\Chainsaw\\Enum\\Format').Webp, quality: 90})|img }}
image.jpg
→ 600×400
intervention-gd
0 ms
12.00 MB
intervention-imagick
0 ms
12.00 MB
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/timber-tree-green.png)
/https://sources.chainsaw.n5s.dev/timber-tree-green.png)
/https://sources.chainsaw.n5s.dev/timber-tree-green.png)
/https://sources.chainsaw.n5s.dev/timber-tree-green.png)
/https://sources.chainsaw.n5s.dev/github.gif)
/https://sources.chainsaw.n5s.dev/github.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/timber.gif)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
/https://sources.chainsaw.n5s.dev/image.jpg)
:contrast(20):sharpen(30):watermark(timber-tree-green.png,-10,-10,30):format(webp):quality(90)/https://sources.chainsaw.n5s.dev/image.jpg)
:contrast(20):sharpen(3,0.3,true):watermark(timber-tree-green.png,-10,-10,30):format(webp):quality(90)/https://sources.chainsaw.n5s.dev/image.jpg)