Invert the Countdown Widget Colours

Follow

This snippet switches the colours for the background of the countdown widget and the background of the numbers. 

Before  After 
Screen_Shot_2017-07-04_at_2.01.13_PM.png Screen_Shot_2017-07-04_at_2.01.01_PM.png 


In order to customize the colors, you will need to fill in the hex codes for the colors (hex codes start with #, and can be seen below as #fff and #635fd9. A great resource for finding the hex code for the colors you want is http://www.colorpicker.com/.

Code:

/*Invert Countdown */
.widget-countdown-number {
   background: #fff;
}
.widget-countdown { background-color:#635fd9; }
.widget-countdown-block span { margin-bottom: 5px; line-height: .4em; display: block; color: white; font-weight: bolder; } .widget-countdown-title { color:white; }
.widget-countdown-number { color: #61596a; }
0 out of 0 found this helpful

Comments

0 comments

Article is closed for comments.