Installation

Install the package from NPM:

yarn add mafs
# or, if using NPM
npm install --save mafs

And then make sure to load the stylesheet.

@import "mafs/core.css";

Now, in your React app, you should be able to render a Mafs view.

import { Mafs, Coordinates } from "mafs"

function HelloFx() {
  return (
    <Mafs>
      <Coordinates.Cartesian />
    </Mafs>
  )
}

Fancy math font

The font in use on this site (Computer Modern Serif) can be used with Mafs by importing mafs/font.css. It will import the appropriate font files and set Mafs' font-family.

@import "mafs/core.css";
@import "mafs/font.css";

Computer Modern looks great, but it comes at a cost: using it will add about 220kB to your page load.