Better web font for I (capital i) and l (small L)

Description of the problem

See this page as an example: https://pygmt-6lvxfpcmx.vercel.app/gallery/line/vector-heads-tails.html

The two “I” in the two red boxes are different. The first one is capital i, and the second one is small L. However, they look the same in the current font (I’m using Microsoft Edge on macOS. Not sure what they look like on other web browsers and platforms).

Should we switch to a better web font? Does the current theme “sphinx_rtd_theme” support custom web fonts?

[maxrjones]

I agree with you. I think it would just involve changing a couple lines in doc/build/_static/style.css. For example, this is the output for the vector example with this css style (which is currently set to open sans):

body {
    font-family: "Tahoma", sans-serif;
}

h1, h2, h3, h4 {
    font-weight: 300;
    font-family: "Tahoma",sans-serif;
}

I like Tahoma because it is sans-serif but still has differences between those two characters.

[seisman]

Looks good to me.