Button Colors

SP Page Builder for all buttons (also Button addon itself) provides different styles (colors) of buttons. Here is a full list of them with HEX color code.

Hover colors of the button are few tones darker than the default one.

Notice! Styles used in SPPB have a different shade of color than you may know from Bootstrap 3/4.

Background colors

There are no predefined colors, all colors can be selected from the palette box. The background color can use an RGBA value, it means that you can decide about transparency. An alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque, default).

Gradients

Just as you can declare the background of an element (Row, Column, Addon) to be a solid color, you can also declare that background to be a gradient. There are also no predefined gradients, all colors are based on user choices only. SP Page Builder uses Linear and Radial gradients. In both you need to specify 2 colors (called color-stops) to create this effect along optionally specifying the direction and start points. They are supported all modern browsers (Safari, Opera, Firefox, Edge, Chrome). Examples with settings are presented below.

• Aqua: Gradient type: linear, Angle: 40deg, two colors #2096ff  and #05ffa3
• Purple: Gradient type: linear, Angle: 40deg, two colors #ff6ec4 and #7873f5
• Peach: Gradient type: linear, Angle: 40deg, two colors #ffd86f  and #fc6262
• Blue: Gradient type: linear, Angle: 40deg, two colors #45cafc and #303f9f