1. Learn
    2. /
  2. Courses
    3. /
  3. Building Dashboards with shinydashboard

Exercise

Customize your shinydashboard with CSS

You can use cascading style sheets (CSS) to further customize a shinydashboard.

There are several ways to do this. Although it is advisable to create a separate CSS file in practice, in this exercise, you will include CSS code directly in body.

Here, you will see how CSS formatting is applied, but don't be intimidated if you don't know CSS! You will only need to modify existing CSS code here.

The header and side bar has been stored as header and sidebar.

Instructions

100 XP
  • Change the background color of the header to hex code "#000000" in line 10.
  • Change the background color of the header (when hovered over) to "gray" in line 14.
  • Now that you have seen everything that makes up a shinydashboard, you can explore a little by modifying the code in any way you like.