Select a hex color that you would like to use. You can use something that is already in use in your theme, or you can find a new one at htmlcolorcodes.com. Darker colors work best since the text at the top is white.

Once you find your color, copy the code snippet below and paste in into the Additional CSS area of your WordPress dashboard (Appearance → Customize → Additional CSS).

.tasty-recipes, 
.tasty-recipes-entry-header .tasty-recipes-image img {
border: 5px solid #666677 !important;
}

.tasty-recipes-entry-header,
.tasty-recipes-entry-content .tasty-recipes-buttons a,
.tasty-recipes-entry-content .tasty-recipes-ingredients ul li:before,
.tasty-recipes-entry-content .tasty-recipes-instructions ul li:before,
.tasty-recipes-entry-content .tasty-recipes-ingredients ol li:before,
.tasty-recipes-entry-content .tasty-recipes-instructions ol li:before,
.tasty-recipes-entry-content .tasty-recipes-notes p:before,
.tasty-recipes-entry-content .tasty-recipes-notes ul li:before,
.tasty-recipes-entry-content .tasty-recipes-notes ol li:before,
.tasty-recipes-entry-footer {
background-color: #666677 !important;
}

.tasty-recipes-entry-content .tasty-recipes-nutrition {
color: #666677 !important;
}

Replace the three instances of #666677 with the hex code of your choice. Make sure to include the # before the color code, and don't delete the !important . If you like what you see, save the changes.

Did this answer your question?