Basic Usage

Just put your image size (width x height) after our URL and you'll get a placeholder.

https://gradientjoy.com/200x300

To get a square image, just put the size you want.

https://gradientjoy.com/200

Gallery

This page lists all the available gradients in a beautiful grid.

You will also find the unique ID associated with each gradient. Please see below on how to get a specific gradient using the ID you find on the Gallery page.

Go to Gallery page

Specific Image

Get a specific image by appending ?id to the end of the url.

https://gradientjoy.com/300x400?id=30

You can find a list of all images and their IDs here.

[
    ...
    {
      "id": 0,
      "name": "Blu",
      "colors": [
      "#00416A",
      "#E4E5E6"
      ],
      "sample_url": "https://gradientjoy.com/300x200?id=0"
    },
    ...
]

API

The /list endpoint will give you a JSON response containing all the gradients.

https://gradientjoy.com/list

Each object in the response will contain the color codes that make up the gradient.