Change fill
Design
February 24, 2021
updated July 2, 2021
You can fill the banner background, shape, or button with:
- Solid colour
2
, - Linear gradient
3
, - Radial gradient
4
, - An Image
5
, - or keep it Transparent
1
.

To fill with Solid colour:
- Choose the Solid colour
2
Fill type. - Click on the Colour button
6
and choose the colour on the Palette by clicking on the hue or shade you would like to use. You can also set the specific colour using hex, RGB or HSL codes.

To fill with Linear gradient:
- Choose the Linear gradient
3
Fill type. - Click on the Colour 1 and Colour 2 buttons
7
and choose the colours on the Palette by clicking on the hue the and shade you would like to use. You can also set the specific colours using hex, RGB or HSL codes. - Set the angle to rotate the gradient
8
.

To fill with Radial gradient:
- Choose the Radial gradient
4
Fill type. - Click on the Colour 1 and Colour 2 buttons
9
and choose the colours on the Palette by clicking on hue the and shade you would like. You can also set the specific colours using hex, RGB or HSL codes.

To fill with an Image:
- Choose the Image
5
Fill type. - Click on the Choose image… button
10
. - Choose the image on the panel
11
or upload your own. - Set the Fill mode that suits the best
12
.- Fill fills the whole element with the image. The image’s proportions are maintained.
- Fit resizes the whole image to fit the element. It usually keeps spaces on the edges.
- Stretch fills the whole element but distorts the image.


He started with development background, then turned into designer and finally came to the product management. Yuri has had a tremendous and different experience. He managed production in a digital agency, managed the development of different apps, financial platforms, CRMs and ERPs. Moreover, Yuri won in some hackathons. Yuri is passioned about building systems and unravel chaos.