[Feature Request] Please add background colour, font colour and font size inputs to the sidebar of the font site.

**What I do now :**

At the moment I have around 27 copy+paste snippets for use with Chrome's devtools console.
They change the background colour, font colour and the font size (of all fonts in one go) at the Google Fonts website.
And also to check for colour fringing
(Change background colour, change font colour, change font size with snippet. Then activate the width slider in the sidebar and filter narrower to watch colour fringing pop up with certain fonts.)
I was told that colour fringing has to do with bad font hinting (and sometimes overzealous subpixel rendering). But I'm not a font expert at all. I just try to methodically filter fonts.

This is tedious though. And could be much easier with some small changes to the font site.

**Live example of what I do now :**

- Go to : https://fonts.google.com/
- F12-key for devtools
- ESC-key to toggle the console
- Copy+paste the following JavaScript and confirm.
The restyling is sticky while navigating, but doesn't survive a refresh.
```JavaScript
var whiteOnBlackStyle=document.createElement('style');
whiteOnBlackStyle.innerHTML="main#main, gf-content-editable.font-preview-text, .t-white .font-preview-headers, .t-white .fonts-module-title, .t-white .fonts-module-subtitle, .font-preview-controls-container {background-color: #000 !important;color: #fff !important;} gf-content-editable.font-preview-text{font-size:22px !important;};";
document.querySelector('head').appendChild(whiteOnBlackStyle);
```
- To also check colour fringing issues, for example : activate the width slider in the sidebar and move slider to the left (narrow fonts) to watch colour fringing pop up with certain fonts. Or change the font size to something like 12px/0.75em or smaller.

**Request : Please add to the sidebar on the right hand side of the screen.**

1. An input box (with or without color picker) for background colour
* Goal(s) :
* change the background colour behind the fonts to the entered colour; on all pages
* be able to determine font suitability for a specific background colour. For example narrow, wide, or tall fonts look different or even fade (lose their intended purpose) on certain background colours.
2. An input box (with or without color picker) for font colour
* Goal(s) :
* change the font colour of all fonts to the entered colour; on all pages
* be able to determine font colour suitability on a specific background colour (chosen at 1)
* detect and exclude fonts which start showing colour fringing on certain background colours (see how in the opening paragraph) possibly in combination with certain font widths and/or sizes
3. An input box for font size
* Goal(s) :
* change the font size of all fonts to the entered size; on the fonts page only ( https://fonts.google.com/ ) not on a font's details page.
* be able to determine font size legibility without having to individually adjust the size of each font on the fonts page
* determine more easy the font size legibility and font size suitability for desktops and devices.
* detect and exclude fonts which start showing colour fringing from certain font widths and/or sizes

* Requirement(s) :
* the entered background colour and font colour should stick while navigating the fonts site (as per my devtools-console copy+paste example)
* the entered colours and size should survive a page refresh (with or without browser cache bypass)
* should also update font colours and font size with devtools opened and the device toolbar toggled on (`Ctrl + Shift + M`).

**Prior content of this issue :**

As per the title.
Just the fonts website. Not to the fonts.

**EDIT:** Just to clarify that I'm aware of the "Feedback - Let us know" link in the sidebar on the right.
For whatever reason I never received a response through that channel. I tried twice last year.
#