Convenient service for replacing images

Assistant for demo content

Many web studios involved in the development of websites have difficulties during the demonstration of the product, namely, when it is necessary to show the finished site containing demo content. Here you have to spin in every possible way and look for a lot of images, adjust them to the desired size, and in some cases stick to the same color scheme.

Here comes the help of the online service Cambelt (in Russian, the timing belt ), which will generate the images you need for your project on the fly.

It is only necessary to specify the URL address (for example, cambelt.co/468x60 ) with the indication of the desired size as the source of the image. You can also use text to create inscriptions and different colors.

')

Here is a quote from the main page of the official site.

It became so easy to create an image for your site, just paste the link from this site into the “src” tag and specify the dimensions you need.

Examples

Now the most important are examples!

Normal image

It's really easy, all you have to do is point to the dimensions you want to use in the link. You can either specify only one value 300 , which will give you a square image, or two value 300x200 to control the shape:
```
<img src="http://cambelt.co/300x200" alt="image" /> 
```
Free text

It's also very simple - after you have specified the dimensions, add the text you want to see in the image. You must replace the spaces with a + . Be careful that the text does not exceed the width of the image.
```
 <img src="http://cambelt.co/300x200/Habrahabr" alt="image" /> 
```
Background color

You can specify custom colors by adding a ? Color = 25d54e line to the end of the query — like so
```
 <img src="http://cambelt.co/300x200/Colors?color=25d54e"alt="image" /> 
```
Text color

You can set custom color elements via ? Color = query string too. To set only the foreground color, you need the prefix , (comma) and HTML color code:
```
 < img src="http://cambelt.co/300x200/Habrahabr?color=,987423" alt="image"/> 
```
Combine both types of color

Thus, in order to combine and use your own foreground color with the background color, you just need to insert both ? Color = parts into a line, like so:
```
 <img src="http://cambelt.co/300x200/Habrahabr?color=234653,eeeeee" alt="image" /> 
```
We use fonts

You can also specify a special font from the wide selection provided on the site to display text inside the image. For a complete list of fonts that are available, you must go to the Font Showcase tab. To use them you just need to specify font =? :
```
 <img src="http://cambelt.co/300x200/Habrahabr?font=Homestead-Display" /> 
```
Font size

You can set a custom font size by passing the font_size = parameter in the query ?:
```
 <img src="http://cambelt.co/300x200/Habrahabr?font_size=12" alt="image" /> 
```
File format

You can request an image in one of 3 formats. The service provides all PNG files by default, but if you prefer others (JPG, GIF), then you can use the ? Format = parameter to get the file you need.
```
 <img src="http://cambelt.co/300x200/JPG?format=jpg" alt="image" /> 
```
Combine both types of color

You can also receive your images over a secure HTTPS connection - for use on secure web pages:
```
 <img src="https://cambelt.herokuapp.com/300x200/Secure" alt="image" /> 
```