Genesis is pre-configured with two colors – light and dark. Changing the template color is as simple as changing a tag in the index.html file.
Switching the Colors
You can switch the template colors by following these instructions:
- Open the index.html file in your code editor.
- To switch to a light color, change the id to the <body> tag to theme-light.
- To switch to a dark color, change the id to the <body> tag to theme-dark.
- Save the index.html file and view the changes in your web browser.
Here is the code which you need to modify to switch to a light color:
<body id="theme-light">
Here is the code which you need to modify to switch to a dark color:
<body id="theme-dark">