It is possible to adjust a website’s color scheme if the default colors make it difficult for you to read the text. The extent to which you can change colors and how to do it differs slightly between available product settings and browsers. Please follow the instructions below for your specific browser.
If you are a student, switching on zyBooks’ Accessibility Mode increases the color contrast of elements that convey meaning without needing to make any adjustments to your browser. To switch on this mode:
- Open one of the books in the My Library
- Open the My Subscription tab on the book’s landing page.
- Set the Accessible Mode switch to On.
View of the Accessibility Mode switch inside the My Subscription tab panel
Develop Mode and Submit Mode toggle buttons before switching on Accessibility Mode
Develop Mode and Submit Mode toggle buttons after switching on Accessibility Mode
At the time of writing, Google Chrome does not by default include functionality to allow you to change website colors. However, there are a couple of accessibility extensions, both of which are free and developed by Google, that you can install. These are:
Refer to Chrome Web Store Help: Install and manage extensions for further instructions and guidance on installing extensions.
Color Enhancer extension
The Color Enhancer extension allows you to adjust the color of foreground content (including text and images).
View of the Color Enhancement user interface
Partial view of the zyBooks home page before using the color enhancer (default view)
Partial view of the zyBooks home page after using the color enhancer
High Contrast extension
The High Contrast extension allows you to change or invert colors on a website. It offers several different options, including increased contrast, grayscale, and yellow-on-black.
View of the High Contrast extension user interface
Partial view of the zyBooks home page before using the high contrast extension (default view)
Partial view of the zyBooks home page after using the high contrast extension (yellow-on-black option selected)
For more information on these extensions, refer to: Google Chrome Help: Use Chrome with Accessibility Extensions.
To change the colors of websites when viewed on Mozilla Firefox:
- Locate and activate the application menu button at the top right-hand side of the browser window to open the related submenu.
- Select Settings.
- Under the Language and Appearance heading, locate and activate the Colors
At this stage, you can choose to change the color of the page’s text, links (both visited and unvisited) and the overall background color. Then, select Always from the Override the colors specified by the page with your selections above the drop-down menu.
Alternatively, if you are using a system level high contrast mode or dark mode, select Only with High Contrast themes from this drop-down menu. As a result, all web pages will honor the high contrast mode you have selected.
View of the Colors panel in Mozilla Firefox
Partial view of the zyBooks home page before adjusting the default colors on Mozilla Firefox
Partial view of the zyBooks home page after adjusting the default colors on Mozilla Firefox
If you need to restore the system defaults, take the following steps:
- Type about:config into Firefox’s address bar and press the Enter If a warning message subsequently appears, select Accept the Risk and Continue.
- Enter browser*color in the Search Preference Name field and press the Enter key (be sure to include the asterisk*).
- Click the Reset button next to each of the modified preferences (shown as bold). Each reset button is represented by a curved, leftwards-pointing, arrow, as shown in the following screenshot.
Restoring Firefox’s system default colors
For more information on adjusting colors on Mozilla Firefox, refer to: Mozilla Support: Change the fonts and colors websites use.
Microsoft Edge does not include specific options to adjust website colors. Instead, Microsoft recommends that you turn on Windows’ High Contrast mode for better readability. In this mode, a stronger contrast is provided between foreground text and its background.
To switch on High Contrast mode:
- Close Microsoft Edge if you have it open.
- Press the Start button, then select Settings followed by Ease of Access and then finally High Contrast.
- Locate the Turn on high contrast switch and set it to On.
Turning on Windows’ High Contrast mode
Partial view of the zyBooks home page before switching on Windows’ High Contrast mode
Partial view of the zyBooks home page after switching on Windows’ High Contrast mode
For more information on accessibility features in Microsoft Edge, refer to: Microsoft Support: Accessibility Features in Microsoft Edge.
To change the colors of websites when viewed on Internet Explorer:
- Locate and activate the tools button at the top right-hand side of the browser window to open the related submenu.
- Select Internet Options.
- Under the Appearance heading, locate and activate the Accessibility
- Under the Formatting heading, check the checkbox labelled Ignore colors specified on webpages and then activate the OK
- Activate the Colors
- Uncheck the Use Windows colors
- Activate the Text, Background, Visited (links), or Unvisited (links) buttons to change their respective colors to your preferences, and then activate the OK
- Activate the OK button in the Internet Options window to close it.
View of the Colors panel in Internet Explorer
Partial view of the zyBooks home page before adjusting the default colors on Internet Explorer
Partial view of the zyBooks home page after adjusting the default colors on Internet Explorer
For more information on accessibility features in Internet Explorer, refer to: Microsoft Support: Internet Explorer Ease of Access Options.
Safari does not include specific options to adjust website colors. Instead, colors need to be adjusted at the system level. To do this:
- Locate and activate the Apple menu at the top left-hand side of screen.
- Select System Preferences.
- Locate and activate the Accessibility
- Locate and activate the Display
- Check the related checkboxes for one or more of the following options:
- Invert colors: Swaps colors around, for example black text on a white background will be shown as white text on a black background. Check the additional Classic invert checkbox to apply this to images as well.
- Increase contrast: This increases the contrast of user interface elements, such as buttons, text fields, and checkboxes.
For more information on adjusting colors on MacOS, refer to: macOS User Guide: Change Display Preferences for Accessibility on Mac.
Note – dark mode
If you are running Mac OS 10.14 or above, or Windows 10 or above, you can also switch on a feature called dark mode. This affects all applications, not just browsers. When this mode is turned on, the browser’s toolbar and menus will be dark. If a website supports dark mode, some browsers will automatically show the website in this mode.
Full instructions for switching on this mode can be found at the following websites:
- Windows: Microsoft Support – Change desktop background and colors
- Mac: Apple Support – How to use Dark Mode on your Mac