Adjust opacity of sections and modules

Version: Kora Courses, November 02, 2023 or later

Permissions required: Student

Backgrounds applied to modules or content sections can have their opacity adjusted to help stylize and define the content.

NOTE:
When customizing your module or section background opacity, remember to make it accessible for all. It's important to have high contrast, like black text on a white background, which is clear and visible. However, if you make a white background too transparent, the black text may blend with the colors or images behind it and become hard to read. To maintain accessibility for everyone, make sure there's a good balance in your design to keep the text easy to read.

  • To adjust module background opacity, select the module and click Settings (1).

0603-1.png

  • In the Style Menu, scroll down to find the Background section (2).

0603-2.png

  • To adjust the opacity of your background color, click the opacity number (3) and then drag the slider to lower or raise the opacity of your background color.

0603-3.png

  • Follow the same steps in the Background Image section of your module settings to adjust the opacity of a background image (4) in your module.

0603-4.png

  • To adjust content section background opacity, select your section and expand the context menu (5). Then click the settings button (6). Then after selecting an image or color from the Color Picker from the menu on the left, you can adjust the Background Opacity (7) to meet your stylistic needs.  

0603-5.png

0603-6.png

NOTE:
An image or background color can be applied to either the top-level or bottom-level background of the section.  For more information about sections, please see “Customizing the background color or image of modules and sections”.

 

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

0 comments

Please sign in to leave a comment.