5

Is there an easy way to display webpages in computer modern font?

closed as off-topic by Sverre, moewe, Svend Tveskæg, user13907, Sean Allred Sep 12 '15 at 10:11

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "This question does not fall within the scope of TeX, LaTeX or related typesetting systems as defined in the help center." – Sverre, moewe, Svend Tveskæg, Community, Sean Allred
If this question can be reworded to fit the rules in the help center, please edit the question.

  • I'm afraid this question is not about TeX, but rather about web page design. Voting to close. – Sverre Sep 12 '15 at 8:55
  • I wouldn't close since this is relevant e.g. for LaTeX2HTML when you want to have a similar look. – Uwe Ziegenhagen Sep 12 '15 at 9:13
  • If you google for Computer modern webfont, a few results like checkmyworking.com/cm-web-fonts come back – Uwe Ziegenhagen Sep 12 '15 at 9:14
  • @Sverre This question helps to find answers on how to make web pages look like latex, so it's not unrelated to latex. – bersling Sep 12 '15 at 9:18
  • 2
    @user3022127 It might not be entirely unrelated. But would you ask a question like "how do I get my MS Word document to look like LaTeX"/"how can I type LaTeX-like math expressions in Word" here or on a MS Word forum? – moewe Sep 12 '15 at 9:35
4

The easiest and most stable way to do this I found was to base64 a font I found at http://mirrors.concertpass.com/tex-archive/fonts/cm-unicode/fonts/otf/. I used the cmunrm.otf from there, base64'ed it and put it as a font face in my css.

@font-face {
  font-family: "my-font";
  src: url(data:font/truetype;charset=utf-8;base64,T1R...gP5w/kP+RAA format("opentype");
}

body {
  font-family: "my-font";
}

You can see an example at https://jsfiddle.net/jtvx9auo/

While you could also simply download the otf file and put it to your server, I found base64ing to be more reliable, e.g. when trying to convert to pdf using wkhtmltopdf.

Not the answer you're looking for? Browse other questions tagged or ask your own question.