I mostly use the "dark" theme which these badges looked good in. The "light" theme is broken though. No contrast.
</SettingsContext.Provider>
  );
}
function setStyleVariable(
  name: string,
  value: string,
  documentElements: DocumentElements,
) {
  documentElements.forEach(documentElement =>
    documentElement.style.setProperty(name, value),
  );
}
function updateStyleHelper(
  themeKey: string,
  style: string,
  documentElements: DocumentElements,
) {
  setStyleVariable(
    `--${style}`,
    `var(--${themeKey}-${style})`,
    documentElements,
  );
}
export function updateDisplayDensity(
  displayDensity: DisplayDensity,
  documentElements: DocumentElements,
): void {
  updateStyleHelper(
    displayDensity,
    'font-size-monospace-normal',