No results found. Try again with different words?

Search must be at least 3 characters.

How to use RGBA color picker?

Sidebar Image

Did not find a solution? We are here to help you succeed.

There are several color formats you can use with the Astra Theme. Though you might be most familiar with HEX codes (e.g. #FFFFFF for white color), you might have noticed that your color picker offers also RGBA format (Red, Green, Blue, Alpha). We have added an RGBA color picker for most of the Customizer settings, to help you add transparency easily.

You can use the RGBA color picker on any color setting that supports it with just a few clicks:

Step 1 – Navigate to the desired setting that you wish to edit, and click on it to open the color picker;

Step 2 – Click on the icon for circling between the available color formats and set it to RGBA;

Step 3 – Once your format is set to RGBA, you can add your color by adding the color values or by dragging the picket on the color scale:

Note:

The selected color doesn’t change when you change the color format. When you change the color format, the color will be automatically shown in the selected format. For example, if you set the white color in HEX format it will be shown as #FFFFFF. If you switch to RGBA the white color will be shown as rgba(255, 255, 255, 1)

Step 4 – You can add transparency to your color by either sliding the transparency bar or by modifying the Alpha (a) value between 0 and 100.

RGBA Color Picker - Set Transparency

Note:

Sliding the transparency bar will automatically switch your color format to RGBA.

Keep in mind that setting the Alpha value to 0 will make it completely transparent and not visible, while setting the value to 100 will remove the transparency.

Feel free to check the video below to see this feature in action:

Was this article helpful?
Sidebar Image

Did not find a solution? We are here to help you succeed.

Related Docs

Join 1,653,898+ Happy Site Owners Using Astra

Whether you are a beginner, small business owner, or professional web developer, Astra provides all the tools you need to easily build your beautiful WordPress website.

Scroll to Top
Now choose your preferred
page builder addon
Choose your preferred page builder addon

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form