Get a Free Trial
website thumbnail

Create website thumbnails with GrabzIt

Often web developers need to create previews of web pages. To improve click through rates and for sharing on Facebook and other social media.

By default GrabzIt's API and Online Screenshot Tool will get website thumbnails by shrinking the website screenshot. Until it fits within the maximum size allowed on the user's package.

To create a thumbnail image to your own specific dimensions. You should ensure that the thumbnail is smaller than the browserWidth and browserHeight parameters. This is 1366px and 1170px respectively by default.

Also important is to keep the ratio of the thumbnail width and height to the browser width and height. This prevents the thumbnail image of the web page screenshot from becoming distorted.

Of course you can take bigger screenshots with GrabzIt, for instance you can capture full page screenshots.

Thumbnail Calculator

px
px
19%
195px
146px

This calculator automatically calculates the best width and height for your thumbnails. Based on what percentage the thumbnail should be of the browser width and height. While also keeping the image proportional to the browser size to stop any stretching of the image.

The calculator above puts any changes made into the code examples below.

How to use our Website Thumbnail API

Integrate the ability to take web page thumbnails into your application with GrabzIt's Screenshot API. To begin, select one of the nine programming languages below. To view a code example and instructions on how to proceed.

This code example shows how easy it is to create a website thumbnail using ASP.NET. To start capturing thumbnails just download the ASP.NET Library. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for ASP.NET to learn all the ways you can use GrabzIt's API.

ImageOptions options = new ImageOptions();
options.BrowserWidth = ;
options.BrowserHeight = ;
options.Width = ;
options.Height = ;

//The client should be stored somewhere and reused!
GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret", client);
grabzIt.URLToImage("https://www.tesla.com", string.Empty, , , , , ImageFormat.jpg, 0, string.Empty, 
BrowserType.StandardBrowser, string.Empty); 
await grabzIt.SaveToAsync("images/result.jpg");

This code example shows how easy it is to create a website thumbnail using Java. To start capturing thumbnails just download the Java Library. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for Java to discover all the ways you can use GrabzIt's API.

ImageOptions options = new ImageOptions();
options.setBrowserWidth();
options.setBrowserHeight();
options.setWidth();
options.setHeight();

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");
grabzIt.URLToImage("https://www.tesla.com", options); 
grabzIt.SaveTo("images/result.jpg");

This code example shows how easy it is to create a website thumbnail using JavaScript. To start capturing thumbnails download GrabzIt's JavaScript Library. Then get your API key and secret, add the domain you want to use the JavaScript on and then check out the screenshot API documentation for JavaScript to discover all the ways you can use GrabzIt's API.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@<%= APIVersion.JavaScript %>/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
{"bwidth":,"bheight":,"width":,"height":}).Create();
</script>

This code example shows how easy it is to create a website thumbnail using Node.js. To start capturing thumbnails just download the Node.js Package. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for Node.js to discover all the ways you can use GrabzIt's API.

var grabzit = require('grabzit');

var options = {"width":, "height":, 
    "browserHeight":, "browserWidth":};

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");
client.url_to_image("https://www.tesla.com", options);
client.save_to("images/result.jpg", function (error, id){
    if (error != null){
        throw error;
    }
});

This code example shows how easy it is to create a website thumbnail using Perl. To start capturing thumbnails just download the Perl Library. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for Perl to discover all the ways you can use GrabzIt's API.

#!/usr/bin/perl

use GrabzItClient;

$options = GrabzItImageOptions->new();
$options->browserWidth();
$options->browserHeight();
$options->width();
$options->height();

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");
$grabzIt->URLToImage("https://www.tesla.com", '', , , , );
$grabzIt->SaveTo("images/result.jpg");

This code example shows how easy it is to create a website thumbnail using PHP. To start capturing thumbnails just download the PHP Library. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for PHP to discover all the ways you can use GrabzIt's API.

include("GrabzItClient.php");

$options = new \GrabzIt\GrabzItImageOptions();
$options->setBrowserWidth();
$options->setBrowserHeight();
$options->setWidth();
$options->setHeight();

$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");
$grabzIt->URLToImage("https://www.tesla.com", $options); 
$grabzIt->SaveTo("images/result.jpg");

This code example shows how easy it is to create a website thumbnail using Python. To start capturing thumbnails just download the Python Library. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for Python to discover all the ways you can use GrabzIt's API.

from GrabzIt import GrabzItClient
from GrabzIt import GrabzItImageOptions

options = GrabzItImageOptions.GrabzItImageOptions()
options.browserWidth = 
options.browserHeight = 
options.width = 
options.height = 

grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret")
grabzIt.URLToImage("https://www.tesla.com", options) 
grabzIt.SaveTo("images/result.jpg") 

These API calls shows how easy it is to create a website thumbnail using GrabzIt's RESTful API. Check out the RESTful screenshot API documentation to discover all the ways you can use GrabzIt.

https://api.grabz.it/convert?key=Sign in to view your Application Key&format=jpg&bwidth=&bheight=&width=&height=&url=https%3A%2F%2Fwww.tesla.com%2F

This code example shows how easy it is to create a website thumbnail using Ruby. To start capturing thumbnails just download the Ruby Gem. Then get your API key and secret and then use the demo contained within. Then check out the screenshot API documentation for Ruby to discover all the ways you can use GrabzIt's API.

require 'grabzit'

options = GrabzIt::ImageOptions.new()
options.browserWidth = 
options.browserHeight = 
options.width = 
options.height = 

grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret")
grabzItClient.url_to_image("https://www.tesla.com", options)	
grabzItClient.save_to("images/result.jpg")