Any way to make the Github comment field monospaced?

Question

With Github being a hosting platform where you write technical things, I also found it very strange that their comment field is not monospaced (like on StackExchange).

Is there a convenient way to change that text field to have a monospace font?

Currently I often use the browser’s inspector (F12) to change the font, but maybe there is an easier way?

Answer 1

This is now possible natively by customizing your settings: https://github.blog/changelog/2021-10-12-fixed-width-font-support-in-markdown-enabled-fields/

Answer 2

The web-extension refined-github does this, ever since #1089. Installation links:

• Chrome.
• Firefox.

Another monospace related feature's is included and that is rendering text in backticks in issue titles, commit titles and more places.

Answer 3

You can use a userscript to target the relevant input elements and apply your styling of choice. If you don't already have one, Tampermonkey is a very popular userscript manager.

Here's an example which you can configure:

// ==UserScript==
// @name        GitHub: Monospaced textareas
// @version     1.0.0
// @description Set the textarea inputs on GitHub.com to use a monospaced font
// @license     MIT
// @author      Jesse Jackson
// @match       https://github.com/*
// @namespace   https://github.com/jsejcksn
// @noframes
// @run-at      document-idle
// ==/UserScript==

(() => {
  'use strict';

  const styleElements = (querySelectorString, styleDeclarations) => {
    const elements = document.querySelectorAll(querySelectorString);
    elements.forEach(element => {
      for (const declaration of styleDeclarations) {
        element.style.setProperty(...declaration);
      }
    });
  };

  const styleDeclarations = [
    ['font-family', 'monospace'],
  ];

  styleElements('textarea', styleDeclarations);
})();