Code Monkey home page Code Monkey logo

katex-fonts's Introduction

KaTeX

npm semantic-release CI codecov Discussions jsDelivr katex.min.js size Gitpod ready-to-code Financial Contributors on Open Collective

KaTeX is a fast, easy-to-use JavaScript library for TeX math rendering on the web.

  • Fast: KaTeX renders its math synchronously and doesn't need to reflow the page. See how it compares to a competitor in this speed test.
  • Print quality: KaTeX's layout is based on Donald Knuth's TeX, the gold standard for math typesetting.
  • Self contained: KaTeX has no dependencies and can easily be bundled with your website resources.
  • Server side rendering: KaTeX produces the same output regardless of browser or environment, so you can pre-render expressions using Node.js and send them as plain HTML.

KaTeX is compatible with all major browsers, including Chrome, Safari, Firefox, Opera, Edge, and IE 11.

KaTeX supports much (but not all) of LaTeX and many LaTeX packages. See the list of supported functions.

Try out KaTeX on the demo page!

Getting started

Starter template

<!DOCTYPE html>
<!-- KaTeX requires the use of the HTML5 doctype. Without it, KaTeX may not render properly -->
<html>
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-wcIxkf4k558AjM3Yz3BBFQUbk/zgIYC2R0QpeeYb+TwlBVMrlgLqwRjRtGZiK7ww" crossorigin="anonymous">

    <!-- The loading of KaTeX is deferred to speed up page rendering -->
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd" crossorigin="anonymous"></script>

    <!-- To automatically render math in text elements, include the auto-render extension: -->
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"
        onload="renderMathInElement(document.body);"></script>
  </head>
  ...
</html>

You can also download KaTeX and host it yourself.

For details on how to configure auto-render extension, refer to the documentation.

API

Call katex.render to render a TeX expression directly into a DOM element. For example:

katex.render("c = \\pm\\sqrt{a^2 + b^2}", element, {
    throwOnError: false
});

Call katex.renderToString to generate an HTML string of the rendered math, e.g., for server-side rendering. For example:

var html = katex.renderToString("c = \\pm\\sqrt{a^2 + b^2}", {
    throwOnError: false
});
// '<span class="katex">...</span>'

Make sure to include the CSS and font files in both cases. If you are doing all rendering on the server, there is no need to include the JavaScript on the client.

The examples above use the throwOnError: false option, which renders invalid inputs as the TeX source code in red (by default), with the error message as hover text. For other available options, see the API documentation, options documentation, and handling errors documentation.

Demo and Documentation

Learn more about using KaTeX on the website!

Contributors

Code Contributors

This project exists thanks to all the people who contribute code. If you'd like to help, see our guide to contributing code. Code contributors

Financial Contributors

Become a financial contributor and help us sustain our community.

Individuals

Contribute on Open Collective

Organizations

Support this project with your organization. Your logo will show up here with a link to your website.

Organization 1 Organization 2 Organization 3 Organization 4 Organization 5 Organization 6 Organization 7 Organization 8 Organization 9 Organization 10

License

KaTeX is licensed under the MIT License.

katex-fonts's People

Contributors

blaiprat avatar edemaine avatar gagern avatar iamdanfox avatar kevinbarabash avatar mathiasbynens avatar sophiebits avatar sven-frotscher avatar xymostech avatar ylemkimon avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar avatar avatar avatar

Forkers

ylemkimon edemaine leungbk justinjaywang edwardyan spencerx ka1bi4 waldenn ngnam knut0815 mbrukman simodevv mainsail-org nast5ia my-maths-expert summersz zeyad-aql-nagwa florian3p ben-dev100 joeemiro untitledunrevised ahmedthahir

katex-fonts's Issues

Add lowercase script and/or lowercase calligraphic letters

Reason: I need to support all characters from https://www.w3.org/2003/entities which includes lower case script letters. As lower case script letters are seldom used, numerical references to Unicode codepoints would suffice [UPDATE: see my next comment], but: due to issue KaTeX/KaTeX#2226 lower case script letters cannot be used this way. If that issue cannot be resolved, it would be nice to have the KaTeX fonts include lower case script letters.

Document the workflow

Prompted by a conversation under KaTeX/KaTeX#2284:

  • Which files should be edited prior to running buildFonts.sh?
  • Where are the TeX files which src/fonts/makeFF supposedly uses?
    • Alternatively: What should they contain and where should they be placed?

README.md and CONTRIBUTING.md don't make that clear.

Merging katex-fonts into the main KaTeX repo

Having the font generation code in the same repo would simplify the process for making font changes. One of the concerns in the past was that having the font files in the repo would bloat the repo. While this has been addressed in part by #54, I think we could take things even further by using Git LFS (Large File Support) for the binary font files.

https://git-lfs.github.com/

\notin missing metrics, \notin & \neq wrong glyph

As mentioned here, the \notin symbol (U+2209, 8713 in decimal) is missing font metrics. This seems to be an isolated instance, but maybe worth checking for other missing characters.

Once this is fixed, we should change the corresponding KaTeX test to check toBuild instead of toParse.

for which katex functions are these fonts used?

We use Katex in Joplin, but run into rendering issues now and again. Most likely because we haven't added all fonts. Laurent is reluctant to add all fonts without knowing what they are actually used for.

Is there a list or matrix of why these fonts are used and what for?

I checked the contributing doc, but there's no reference to a help forum or something else.
So I hope it's ok to ask a question here.

Add italic capital Greek letters

AMS defines these macros for italic capital Greek letters:

\varGamma
\varDelta
\varTheta
\varLambda
\varXi
\varPi
\varSigma
\varUpsilon
\varPhi
\varPsi
\varOmega

These are the remaining characters (I believe) needed for KaTeX/KaTeX#130

Generation of redundant bold glyphs?

During clean-up of font generation scripts, it was discovered that extra glyphs like \cdots and \longleftarrow for Main-Bold font were generated.

However, it seems that it's not used in the KaTeX, nor is it possible to access them.

Is it used anywhere? Or, will it be used in the future?

katex-fonts/src/fonts/OTF/TeX/makeFF

Lines 1899 to 2169 in 2b91a1c

$extra{'Main-Bold'} = {
cdots => [
'Select(0u22C5)','Copy()',
'Select(0u22EF)','Paste()',
'PasteWithOffset(488,0)',
'PasteWithOffset(976,0)',
'SetRBearing(976,1)',
],
ldots => [
'Select(0u2E)','Copy()',
'Select(0u2026)','Paste()',
'PasteWithOffset(488,0)',
'PasteWithOffset(976,0)',
'SetRBearing(976,1)',
],
vdots => [
'Select(0u2E)','Copy()',
'Select(0u22EE)','Clear()',
'PasteWithOffset(0,-30)',
'PasteWithOffset(0,380)',
'PasteWithOffset(0,780)',
'SetRBearing(-681,1)',
],
ddots => [
'Select(0u2E)','Copy()',
'Select(0u22F1)','Clear()',
'PasteWithOffset(55,700)',
'PasteWithOffset(502,400)',
'PasteWithOffset(949,100)',
'SetRBearing(323,1)',
],
spaceEn => [
'Select(0u2002)',
'SetRBearing(500)',
],
spaceEm => [
'Select(0u2003)',
'SetRBearing(999)',
],
space3 => [
'Select(0u2004)',
'SetRBearing(333)',
],
space4 => [
'Select(0u2005)',
'SetRBearing(250)',
],
space6 => [
'Select(0u2006)',
'SetRBearing(167)',
],
thinspace => [
'Select(0u2009)',
'SetRBearing(167)',
],
hairspace => [
'Select(0u200A)',
'SetRBearing(83)',
],
cong => [
'Select(0u223C)','Copy()',
'Select(0u2245)','Clear()',
'PasteWithOffset(0,247)',
'Select(0u3D)','Copy()',
'Select(0u2245)',
'PasteWithOffset(0,-136)',
],
bowtie => [
'Select(0u25B9)','Copy()',
'Select(0u22C8)','Paste()',
'Select(0u25C3)','Copy()',
'Select(0u22C8)',
'PasteWithOffset(425,0)',
'SetRBearing(425,1)',
'RemoveOverlap()',
],
models => [
'Select(0u2223)','Copy()',
'Select(0u22A8)','Paste()',
'Select(0u3D)','Copy()',
'Select(0u22A8)',
'PasteWithOffset(89,0)',
'SetRBearing(655,1)',
'RemoveOverlap()',
],
doteq => [
'Select(0u3D)','Copy()',
'Select(0u2250)','Paste()',
'Select(0u2E)','Copy()',
'Select(0u2250)',
'PasteWithOffset(288,550)',
],
not => [
'Select(0u338)',
'SetRBearing(894,1)',
],
notin => [
'Select(0u2208)','Copy()',
'Select(0u2209)','Paste()',
'Select(0u338)','Copy()',
'Select(0u2209)',
# 'PasteWithOffset(-63,0)',
'PasteWithOffset(831,0)',
'RemoveOverlap()',
],
noteq => [
'Select(0u3D)','Copy()',
'Select(0u2260)','Paste()',
'Select(0u338)','Copy()',
'Select(0u2260)',
# 'PasteWithOffset(0,0)',
'PasteWithOffset(894,0)',
'RemoveOverlap()',
],
longleftarrow => [
'Select(0u2190)','Copy()',
'Select(0u27F5)','Paste()',
'Select(0u2212)','Copy()',
'Select(0u27F5)',
'PasteWithOffset(944,0)',
'SetRBearing(655,1)',
'RemoveOverlap()','Simplify()',
],
Longleftarrow => [
'Select(0u21D0)','Copy()',
'Select(0u27F8)','Paste()',
'Select(0u3D)','Copy()',
'Select(0u27F8)',
'PasteWithOffset(975,0)',
'SetRBearing(718,1)',
'RemoveOverlap()','Simplify()',
],
longrightarrow => [
'Select(0u2212)','Copy()',
'Select(0u27F6)','Paste()',
'Select(0u2192)','Copy()',
'Select(0u27F6)',
'PasteWithOffset(688,0)',
'SetRBearing(939,1)',
'RemoveOverlap()','Simplify()',
],
Longrightarrow => [
'Select(0u3D)','Copy()',
'Select(0u27F9)','Paste()',
'Select(0u21D2)','Copy()',
'Select(0u27F9)',
'PasteWithOffset(720,0)',
'SetRBearing(976,1)',
'RemoveOverlap()','Simplify()',
],
leftrightarrow => [
'Select(0u2190)','Copy()',
'Select(0u27F7)','Paste()',
'Select(0u2192)','Copy()',
'Select(0u27F7)',
'PasteWithOffset(976,0)',
'SetRBearing(976,1)',
'RemoveOverlap()','Simplify()',
],
Leftrightarrow => [
'Select(0u21D0)','Copy()',
'Select(0u27FA)','Paste()',
'Select(0u21D2)','Copy()',
'Select(0u27FA)',
'PasteWithOffset(976,0)',
'SetRBearing(976,1)',
'RemoveOverlap()','Simplify()',
],
mapsto => [
'Select(0u2192)','Copy()',
'Select(0u21A6)','Paste()',
'Generate("otf/KaTeX_Main-Bold.otf")',
'Open("pfa/cmbsy10.pfa")',
'Select(0x37)','Copy()',
'Open("otf/KaTeX_Main-Bold.otf")',
'Select(0u21A6)',
'PasteWithOffset(0,0)',
'RemoveOverlap()','Simplify()',
],
xlongmapsto => [
'Select(0u27F6)','Copy()',
'Select(0u27FC)','Paste()',
'Generate("otf/KaTeX_Main-Bold.otf")',
'Open("pfa/cmbsy10.pfa")',
'Select(0x37)','Copy()',
'Open("otf/KaTeX_Main-Bold.otf")',
'Select(0u27FC)',
'PasteWithOffset(0,0)',
'RemoveOverlap()','Simplify()',
],
hookleftarrow => [
'Select(0u2190)','Copy()',
'Select(0u21A9)','Paste()',
'Generate("otf/KaTeX_Main-Bold.otf")',
'Open("pfa/cmmib10.pfa")',
'Select(0x2D)','Copy()',
'Open("otf/KaTeX_Main-Bold.otf")',
'Select(0u21A9)',
'PasteWithOffset(965,0)',
'SetRBearing(132,1)',
'RemoveOverlap()','Simplify()',
],
hookrightarrow => [
'Generate("otf/KaTeX_Main-Bold.otf")',
'Open("pfa/cmmib10.pfa")',
'Select(0x2C)','Copy()',
'Open("otf/KaTeX_Main-Bold.otf")',
'Select(0u21AA)','Paste()',
'Select(0u2192)','Copy()',
'Select(0u21AA)',
'PasteWithOffset(132,0)',
'SetRBearing(963,1)',
'RemoveOverlap()','Simplify()',
],
rightleftharpoons => [
'Select(0u21BD)','Copy()',
'Select(0u21CC)','Paste()',
'Select(0u21C0)','Copy()',
'Select(0u21CC)',
'PasteWithOffset(0,200)',
'RemoveOverlap()','Simplify()',
],
hbar => [
'Select(0u2C9)','Copy()',
'Select(0u210F)','PasteWithOffset(0,0)',
'RemoveOverlap()','Simplify()',
],
angle => [
'Select(0u2220)','Copy()',
'PasteWithOffset(0,10)',
'PasteWithOffset(0,20)',
'RemoveOverlap()','Simplify()',
'PasteWithOffset(10,0)',
'RemoveOverlap()','Simplify()',
],
diacriticals => [
'Select(0uB0)', 'SetRBearing(-147,1)', # \degree
'Select(0u20D7)','SetRBearing(154,1)', # \vec
],
};

CC @kevinbarabash @edemaine

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.