Table Color Settings

It’s very easy to customize table colors with Ninja Tables efficiently. Color customization is an awesome feature that lets you control the table designs and appearance.

Let’s read the article to learn how to do that.

How to customize the color of a table #

  • First, you must set up a Table using the Ninja Tables plugin.

  • Then go to the plugin’s dashboard. Here you will find a list of your current tables. To customize the color, select your preferred table that suits your needs.

  • Click on the Edit button to view the table.

Click on Edit button to view table
Click on the Edit button to view the table
  • Next, click on the Table Design tab from the list of other Tabs.

  • On the right side, a sidebar appears in the Table Design tab. Three separate segments are visible in this sidebar with specific functions. Select Table Colors from the second segment.

Table Design
Table Design

  • The Table Color tab appears with its functions. You will notice a dropdown list of various preset colors in the Pre-Defined Scheme option.

Pre-defined color scheme #

The color of the tables changes according to the pre-set color combination you choose.

Select Color Scheme
Select Color Scheme
  • Let’s take a look at an example where the background of the table is Olive –
Olive background of the table background
Olive background of the table background

Custom color scheme #

Custom colors can also be configured if the default colors do not meet your needs. Color the table with any combination you want.

  • To do so, click the Custom Scheme option in the Select Color Scheme section. Then select the color of your choice.

Custom Scheme
Custom Scheme

  • The table’s Hover color can also be adjusted. Go to the Custom Scheme section. Then in the Table Body Colors, you will find the Hover tab on the right side. Customize the hover color according to your needs.
custom color palette

  • Another way to customize colors is by using an Alternate Color Schema for Table Rows. Under the Table Body Colors tab, select the Alternate Color Schema for Table Rows option. Choose your preferred custom colors to display them over alternative rows.

Alternate Color Schema for Table Rows
Alternate Color Schema for Table Rows

You can also change the color of your table with CSS. Check out this documentation

Also, check out – Table Font Setting.