CODEWITHSUNDEEP
colorsmathjax
Maciej Caputa
Maciej Caputa

Reputation: 1891

How to define custom colors in MathJax in config?

Note: I know that I can define custom colors in MathJax by $$\definecolor{somecolor}{RGB}{1243,45,46}$$ and then use it as $$\color{somecolor}{test}$$.

Question: However, I would like to define the color in a MathJax config object i.e. I don't want to render same command e.g. $$\definecolor{somecolor}{RGB}{1243,45,46}$$ on every page whenever I need the color. Therefore I'm looking for a solution that would look like this.

MathJax.Hub.Config({
  TeX: {
    // I can use this extension
    extensions: ["color.js"]
  }
  // I would like to define my custom colors here.
});

Upvotes: 3

Views: 1135

Answers (2)

user5906708
user5906708

Reputation:

If the most important thing is to have a central location where colors are defined once, an alternate solution is to use the TeX extension "HTML.js" (found here) in the MathJax config file to define custom colors using CSS. To the MathJax config file, under TeX, add the extension:

MathJax.Hub.Config({
  TeX: {
    extensions: ["HTML.js"] //plus any other extensions
  }
});

Then you can define all custom colors in the CSS as classes and apply them to expressions with \{class}{math}. For example, the CSS could have classes for each color (here "red" and "blue").

CSS

.red {color: #FF0011;}
.blue {color: #2200FF;}

Then $$\class{red}{a+b} + \class{blue}{c}$$ will create the expression "a + b + c" where "a + b" is that shade of red, and "c" is that shade of blue.

Upvotes: 1

Peter Krautzberger
Peter Krautzberger

Reputation: 5305

Add

MathJax.Hub.Register.StartupHook("TeX color Ready", function() {
     var color = MathJax.Extension["TeX/color"];
     color.colors["somecolor"] = color.getColor('RGB','123,45,46');
});

to the bottom of your configuration block (or if you're using plain JS, put it in the AuthorInit call).

Update

To answer the question from the comments, you can use HTML colors in the configuration by writin directly to the color object.

MathJax.Hub.Register.StartupHook("TeX color Ready", function() {
     MathJax.Extension["TeX/color"].colors["somecolor"] = '#2B2B2B';
});

Upvotes: 5

Related Questions