Root
Root component - Abyssale REST API
As mentioned before, the
root
element can be used to customise the background of your image.Property | Description |
---|---|
background_color | 2 filling modes are available:
|
Monochrome supported formats are:
- 6 hexadecimal digits with a starting
#
:- Specified with:
#RRGGBB
. RR (red), GG (green) and BB (blue) - Example: #0000FF
- 8 hexadecimal digits with a starting
#
:- This format is an extended version of the 6 hexa digits, allowing to define an opacity to the color.
- Specified with:
#RRGGBBAA
. RR (red), GG (green), BB (blue) and AA (alpha) - Example: #0000FF80 represents the blue color with a 50% opacity (
80
). - Here is the representation list of opacity (in percentage) to hexadecimal: (you can also find all values in this codepen)
Opacity (on a scale to 0-100) | AA (Alpha Hexadecimal) |
---|---|
0 | 00 |
5 | 0D |
10 | 1A |
20 | 33 |
30 | 4D |
40 | 66 |
50 | 80 |
60 | 99 |
70 | B3 |
80 | CC |
90 | E6 |
100 | FF |
3 hexadecimal colors are not supported (such as
#AAA
)A linear gradient property can be used as
background_color
(banner background, button) & color
(text).The linear gradient format is represented as:
linear-gradient(x1% y1% x2% y2%,offset_color1% hexa_color1 opacity_color1,offset_color2% hexa_color2 opacity_color2)
Gradient properties | Description |
---|---|
x1, y1, x2, y2 | Number (Percentage), can be negative. Define the straight line that will be used to draw the background. |
offset_color1 , offset_color2 | Number (Percentage), can be negative. Define the offset of the starting & ending points (default: 0%, 100%) |
hexa_color1 , hexa_color2 | String: 6 digits hexa color. Starting & ending colors |
opacity_color1 , opacity_color2 | Float (between 0 & 1). Opacity of starting & ending colors |
Monochrome: "background_color": "#610000" | ![]() |
Linear gradient (horizontal): "background_color": "linear-gradient(0% 0% 100% 0%,0% #1a47ff 1,100% #b65151 1)" | ![]() |
Linear gradient (vertical): "background_color": "linear-gradient(0% 0% 0% 100%,0% #1a47ff 1,100% #b65151 1)" | ![]() |
Linear gradient (diagonal): "background_color": "linear-gradient(0% 0% 100% 100%,0% #1a47ff 1,100% #b65151 1)" | ![]() |
Last modified 11mo ago