Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?


Failed to load latest commit information.
Latest commit message
Commit time
January 26, 2023 18:33
September 29, 2020 05:42
March 5, 2023 14:07
September 6, 2021 12:13
January 23, 2023 11:07
March 5, 2023 14:18


Mafs is a set of opinionated React components for creating math visualizations.

Visit the docs →


Development is done inside of the Next.js documentation site, which directly imports Mafs components from src/. To start the development server, run:

pnpm install
pnpm start

Then visit localhost:3000.


Mafs uses unit, end-to-end, and visual regression testing to ensure consistency between updates. It takes literal screenshots of components as rendered by the browser, and compares them to a known "correct" screenshot. Two of the browsers may require a Mac to run (Safari and iOS Safari).

All examples on the documentation site are visually tested automatically—the test file is autogenerated.

pnpm test      # run both suites
pnpm test:unit # to run just the Jest tests
pnpm test:e2e  # to run Playwright (end-to-end and visual tests)
pnpm test -- --update-snapshots # to update the visual test baselines