{"id":20744261,"url":"https://github.com/mathjax/mathjax-demos-web","last_synced_at":"2026-02-06T16:06:49.519Z","repository":{"id":38350770,"uuid":"108648943","full_name":"mathjax/MathJax-demos-web","owner":"mathjax","description":"A repository with examples using mathjax-v3","archived":false,"fork":false,"pushed_at":"2024-12-16T13:48:28.000Z","size":10620,"stargazers_count":260,"open_issues_count":2,"forks_count":107,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-01-18T02:27:43.014Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://mathjax.github.io/MathJax-demos-web","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mathjax.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-10-28T12:54:32.000Z","updated_at":"2025-01-08T01:47:17.000Z","dependencies_parsed_at":"2024-08-01T19:45:09.174Z","dependency_job_id":"fe04f526-c154-48b5-8675-2d16f78c574f","html_url":"https://github.com/mathjax/MathJax-demos-web","commit_stats":null,"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mathjax%2FMathJax-demos-web","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mathjax%2FMathJax-demos-web/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mathjax%2FMathJax-demos-web/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mathjax%2FMathJax-demos-web/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mathjax","download_url":"https://codeload.github.com/mathjax/MathJax-demos-web/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243039584,"owners_count":20226131,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-17T07:14:51.368Z","updated_at":"2026-02-06T16:06:49.513Z","avatar_url":"https://github.com/mathjax.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [MathJax-demos-web](https://github.com/mathjax/MathJax-demos-web)\n\u003cimg class=\"shield\" alt=\"GitHub release version\" src=\"https://img.shields.io/github/v/release/mathjax/MathJax-demos-web.svg?sort=semver\"\u003e\n\nA repository with examples using [MathJax version\n4](https://github.com/mathjax/MathJax-src) in web pages.\n\nSee the [MathJax Node\nDemos](https://github.com/mathjax/MathJax-demos-node) for examples of\nhow to use MathJax in node applications.  See the [MathJax\ndocumentation](https://docs.mathjax.org/) for complete details of how\nto use MathJax in web browsers and node.\n\n## Samples of MathJax v4\n\nThe examples below show how to use and configure MathJax components in\nyour web pages.  The links take you to the live demos; most have a\n\"Show Source\" button at the bottom that you can use to see addition\nexplanation and the important sections of the source of the HTML\ndocument.  The last few examples show how to create your own custom\ncomponents, custom tex extensions, or customized single-file webpacked\nversions of MathJax.\n\n### Processing the Whole Page\n\n* [tex-chtml.html](https://mathjax.github.io/MathJax-demos-web/page/tex-chtml.html)\n* [tex-mml.html](https://mathjax.github.io/MathJax-demos-web/page/tex-mml.html)\n* [tex-svg.html](https://mathjax.github.io/MathJax-demos-web/page/tex-svg.html)\n* [mml-chtml.html](https://mathjax.github.io/MathJax-demos-web/page/mml-chtml.html)\n* [mml-svg.html](https://mathjax.github.io/MathJax-demos-web/page/mml-svg.html)\n* [equation-numbers.html](https://mathjax.github.io/MathJax-demos-web/page/equation-numbers.html)\n* [equation-refs.html](https://mathjax.github.io/MathJax-demos-web/page/equation-refs.html)\n\n### Processing User Input\n\n* [tex2chtml.html](https://mathjax.github.io/MathJax-demos-web/input/tex2chtml.html)\n* [tex2mml.html](https://mathjax.github.io/MathJax-demos-web/input/tex2mml.html)\n* [tex2svg.html](https://mathjax.github.io/MathJax-demos-web/input/tex2svg.html)\n* [mml2chtml.html](https://mathjax.github.io/MathJax-demos-web/input/mml2chtml.html)\n* [mml2svg.html](https://mathjax.github.io/MathJax-demos-web/input/mml2svg.html)\n* [tex-mml2chtml.html](https://mathjax.github.io/MathJax-demos-web/input/tex-mml2chtml.html)\n* [tex_mml2svg.html](https://mathjax.github.io/MathJax-demos-web/input/tex-mml2svg.html)\n\n### Interaction\n\n* [reveal-steps.html](https://mathjax.github.io/MathJax-demos-web/interaction/reveal-steps.html)\n* [toggle-steps.html](https://mathjax.github.io/MathJax-demos-web/interaction/toggle-steps.html)\n\n### Version 2 Compatibility\n\n* [v2-color.html](https://mathjax.github.io/MathJax-demos-web/v2-support/v2-color.html)\n* [v2-script-tags.html](https://mathjax.github.io/MathJax-demos-web/v2-support/v2-script-tags.html)\n* [v2-compatibility.html](https://mathjax.github.io/MathJax-demos-web/v2-support/v2-compatibility.html)\n* [v2 to v4 Configuration Converter](https://mathjax.github.io/MathJax-demos-web/convert-configuration/convert-configuration.html)\n\n### MathML and Assistive Extensions\n\n* [tex-mml.html](https://mathjax.github.io/MathJax-demos-web/page/tex-mml.html)\n* [mml-attribute.html](https://mathjax.github.io/MathJax-demos-web/custom/mml-attribute.html)\n* [speech generator lab](https://mathjax.github.io/MathJax-demos-web/speech-generator/convert-with-speech.html) (explores all possible speech options)\n\n### Customization\n\n* [load-mathjax.html](https://mathjax.github.io/MathJax-demos-web/custom/load-mathjax/load-mathjax.html)\n* [tex-macros.html](https://mathjax.github.io/MathJax-demos-web/custom/tex-macros.html)\n* [customized-load.html](https://mathjax.github.io/MathJax-demos-web/custom/customized-load.html)\n* [custom-tex-extension](https://mathjax.github.io/MathJax-demos-web/custom/custom-tex-extension/mml.html)\n* [custom-component](https://mathjax.github.io/MathJax-demos-web/custom/custom-component/custom-component.html)\n* [custom-build](https://mathjax.github.io/MathJax-demos-web/custom/custom-build/custom-mathjax.html)\n\n\n## MathJax Component Files\n\nMathJax has the ability to create MathJax \"components\" that can be\ndynamically loaded by MathJax as needed.  This allows portions of\nMathJax to be bundled together into components that include most or\nall of what you need to run MathJax, but still allows less-used pieces\nto be loaded on demand later when needed.\n\nThe main goal of these components is to use them for the delivery of\nMathJax from the CDNs that host MathJax.  This allows you to customize\nthe MathJax components that you use without needing to have every\npossible combination of parts that anyone would need packaged together\nas single files.  MathJax provides a number of all-in-one packages\nthat include an input and output jax together with the data for a font\nto be used; but there are also separate components for the individual\ninput and output jax, fonts, TeX extensions, and so on, so that you\ncan mix-and-match them as needed.\n\nMathJax components can be used in the browser as well as on the server\nin `node` applications, so browser and server-side applications can\nuse the same code base and configurations.  Components can be combined\ntogether into larger packages, either with other MathJax components,\nor with your own code, via `webpack`, for example.\n\nThe tools for building components are available so you can create your\nown custom components that you can serve from your own website if you\nhave special needs not addressed by the versions of MathJax available\non CDNs.  For example, authors writing TeX extensions for MathJax can\ncreate their own components that can be loaded into MathJax from a\ndifferent server even if the core MathJax is loaded from a CDN.\n\nAlthough components are a convenient way of working with MathJax,\nthose writing `node` scripts that use MathJax need not use the\ncomponents as we have packaged them; they can import MathJax modules\ninto their projects directly.  The [MathJax node\ndemos](https://github.com/mathjax/MathJax-demos-node) repository have\nexamples of how to do this.\n\n## Configuring Components\n\nThe component system described above can be configured using a global\nvariable `MathJax` that you set before loading the main MathJax\ncomponent that you are planning to use.  The `MathJax` variable\nspecifies configuration blocks for the various components, as\nillustrated in the examples below, and described in more detail in a\nseparate section below.  MathJax will modify this global variable to\ninclude the methods and data that it creates during the startup\nprocess for your use in your applications.\n\nTo configure MathJax, use\n\n``` html\n\u003cscript\u003e\nMathJax = {\n  [options]\n};\n\u003c/script\u003e\n```\n\nbefore the `script` tag that loads the MathJax component file you plan\nto use, where `options` are a list of options that control various\nparts of MathJax.  The options are grouped into blocks based on the\ncomponent of MathJax that they affect.  For example, the TeX input jax\noptions are in a blocks called `tex`, and the SVG output jax options\nare in a block called `svg`.  An example configuration could be\n\n``` html\n\u003cscript\u003e\nMathJax = {\n  tex: {\n    inlineMath: {'[+]': [['$', '$']]},\n    packages: ['base', 'newcommand', 'configMacros']\n  },\n  svg: {\n    fontCache: 'global'\n  }\n};\n\u003c/script\u003e\n```\n\nThe options are listed in detail in the [Configuring\nMathJax](https://docs.mathjax.org/en/latest/options/index.html)\nsection of the [MathJax\nDocumentation](https://docs.mathjax.org/en/latest).\n\n## Converting from Version 3\n\nThe configuration block for MathJax v4 is nearly identical to that for\nv3, through there are more options available in v4, and a few have\nbeen renamed.  Most page authors will not need to change their\nconfigurations unless they used one of the renamed options.  Some uses\nof the `startup.ready()` and `startup.pageReady()` functions may need\nto be adjusted, however, depending on whether they used or modified\nany of the internal structures of MathJax.  See the [What's New in\nMathJax\nv4](https//docs.mathjax.org/en/latest/upgrade/whats-new-4.0/index.html)\nsection of the documentation for more details, particularly the\n[Breaking\nChanges](https//docs.mathjax.org/en/latest/upgrade/whats-new-4.0/breaking.html)\nsection.\n\n## Converting from Version 2\n\nThe structure of the MathJax configuration, and many of the names of\nthe options, have changed from version 2 to versions 3 and 4.  For\nexample, there is no longer a `MathJax.Hub.Config()` call, but\ninstead, you use a global `MathJax` variable to set the configuration\n(this was possible in version 2, but most people used the older\n`Mathjax.Hub.Config()` approach).\n\nIn order to help you move from version 2 to version 3, there is a\n[configuration\nconverter](https://mathjax.github.io/MathJax-demos-web/configuration-converter/configuration-converter.html)\nthat will take your old version 2 configuration and give you the\ncorresponding version 4 configuration.\n\nNote that not all options from version 2 are available.  Some have\nbeen deprecated (like the auto-bold extention), while others no loner\napply (like the options controlling previews).\n\n## Obtaining the Components\n\nThe component files for these demos are available from several [CDN\nservers](https://docs.mathjax.org/en/latest/web/start.html#using-mathjax-from-a-content-delivery-network-cdn),\nwhich you can access without having to install or download any files.\nJust use a link such as\n\n``` html\n\u003cscript defer src=\"https://cdn.jsdelivr.net/npm/mathjax@4/tex-mml-chtml.js\"\u003e\u003c/script\u003e\n```\n\nto load the latest version (4.x.x) of the `tex-mml-chtml` combined\ncomponent file from the ``jsdelivr`` CDN.  See the\n[documentation](https//docs.mathjax.org/en/latest/index.html#browser-components)\nfor more details on how to use MathJax in web pages.\n\nLocal copies of the MathJax component files can be obtained from the\n[MathJax Component Repository](https://github.com/mathjax/MathJax).\nSee its [README file](https://github.com/mathjax/MathJax/README.md)\nfor complete information about how to obtain the files.\n\n## MathJax Resources\n\n* [MathJax Documentation](https://docs.mathjax.org)\n* [MathJax Components](https://github.com/mathjax/MathJax)\n* [MathJax Source Code](https://github.com/mathjax/MathJax-src)\n* [MathJax Web Examples](https://github.com/mathjax/MathJax-demos-web)\n* [MathJax Node Examples](https://github.com/mathjax/MathJax-demos-node)\n* [MathJax Bug Tracker](https://github.com/mathjax/MathJax/issues)\n* [MathJax Users' Group](http://groups.google.com/group/mathjax-users)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmathjax%2Fmathjax-demos-web","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmathjax%2Fmathjax-demos-web","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmathjax%2Fmathjax-demos-web/lists"}