Files
KaTeX/docs/font.md
ylemkimon 8a38035855 KaTeX website & documentation (#1484)
* website/docs: initial commit

* Change secondaryColor

* Fix index.css not being copied and included on global stylesheet

* Fix stylesheet link

[skip ci]

* Change documentation link to API(Usage)

[skip ci]

* Add `Libraries` in usage

[skip ci]

* Remove documentation from `README.md` and add link to the site

[skip ci]

* Use KaTeX in the parent directory to build Markdown

[skip ci]

* Revise function support page. Avoid error msgs.

* General edit to function support page
2018-07-26 20:19:40 -07:00

3.0 KiB
Raw Blame History

id, title
id title
font Font

By changing the variables in the fonts.less file at the katex-fonts submodule, several properties of the way fonts are used can be changed.

Font size and lengths

By default, KaTeX math is rendered in a 1.21× larger font than the surrounding context, which makes super- and subscripts easier to read. You can control this using CSS, for example:

.katex { font-size: 1.1em; }

KaTeX supports all TeX units, including absolute units like cm and in. Absolute units are currently scaled relative to the default TeX font size of 10pt, so that \kern1cm produces the same results as \kern2.845275em. As a result, relative and absolute units are both uniformly scaled relative to LaTeX with a 10pt font; for example, the rectangle \rule{1cm}{1em} has the same aspect ratio in KaTeX as in LaTeX. However, because most browsers default to a larger font size, this typically means that a 1cm kern in KaTeX will appear larger than 1cm in browser units.

Kinds of fonts used

The default build of KaTeX includes each of the needed fonts in three different formats: ttf, woff, and woff2.

  • ttfs are included to support old versions of Chrome, Safari, Firefox, etc. (By old, I mean Firefox 3.5, Chrome <5, Safari <=5.1 all of which are no longer supported: see woff vs ttf).
  • woff is the format that is most widely supported (all modern browsers support it), so it probably provides the most benefit to being included.
  • woff2s are included for very new versions of Chrome, because they are much smaller and faster to load.

Based on this information and what you want to support with your website, you might decide to include different versions of the fonts besides what comes with the standard installation.

For example, if you wanted to create a trimmed down version of KaTeX, you could only include the woff files and gain the most support with the least number of files. To do this:

  1. Set @use-ttf, and @use-woff2 to false at the top of fonts.less.
  2. Rebuild KaTeX by running npm run build from the top-level directory.
  3. Include only the build/fonts/*.woff2 files in your distribution.

Location of font files

The default build of KaTeX expects the KaTeX fonts to be located in a directory called fonts which is a sibling of the katex.min.css stylesheet. This can be changed as such:

  1. At the top of the fonts.less file, set @font-folder to the location of your fonts. You can use relative or absolute paths, so setting it to "/fonts" would cause it to search for the fonts in a root fonts folder, while "../fonts" would search in a fonts directory one level above the katex.min.css file.
  2. Rebuild KaTeX by running npm run build from the top-level directory.
  3. Use the newly generated build/katex.min.css file, and place the fonts where you indicated.