Writing Math in Brightspace

This tutorial shows you how to add accessible math equations anywhere in D2L Brightspace using the HTML code editor.

New to LaTeX? This tutorial assumes basic familiarity with LaTeX math syntax. The examples below show common patterns you can copy and modify.

Where This Works

Any place you see the WYSIWYG (rich text) editor in Brightspace supports this method:

Content pages and modules
Assignment descriptions and instructions
Quiz questions and answer choices
Discussion prompts
Feedback comments to students
Announcements

The Two Math Delimiters

MathJax recognizes two delimiter styles in Brightspace:

Type	Delimiter	Result
Inline	`$...$`	Math flows within your sentence
Display	`\[...\]`	Math appears centered on its own line

Examples

Inline math keeps equations in the flow of text:

Einstein’s famous equation $E=mc^2$ changed physics forever.

Display math gives equations visual prominence:

The relationship between energy and mass is:
\[E=mc^2\]

Adding Math: Step by Step

Open the HTML Editor

In any Brightspace text area, locate the WYSIWYG toolbar. Click the </> button (usually on the far right) to switch to HTML source view.

Write Your Inline Math

For equations within a sentence, use backslash-parentheses:

<p>The quadratic formula is \(x = \frac{-b \pm \sqrt{b^2-4ac}}{2a}\) where a, b, and c are coefficients.</p>

Write Your Display Math

For standalone equations, use backslash-brackets:

<p>The quadratic formula is:</p>
\[x = \frac{-b \pm \sqrt{b^2-4ac}}{2a}\]

Switch Back and Preview

Click the </> button again to return to the visual editor. Your LaTeX will appear as rendered math.

Critical Detail: Angle Brackets in HTML

The < and > symbols break HTML. If your LaTeX contains less-than or greater-than symbols, you must use HTML entities instead.

In HTML source view, the browser interprets < as the start of an HTML tag. This corrupts your equation.

Use these HTML entities:

\lt instead of < (less than)
\gt instead of > (greater than)

Example

Instead of writing:

\(x < 5\)  <!-- This will break -->

Write:

\(x \lt 5\)  <!-- This works correctly -->

The rendered output displays the proper < symbol: $x \lt 5$

Common Patterns

Quick Reference: Inline Examples

<!-- Simple expression -->
The value \(x = 5\) satisfies the equation.

<!-- Fraction -->
The ratio is \(\frac{1}{2}\) of the total.

<!-- Subscript and superscript -->
Water is \(H_2O\) and area is \(r^2\).

<!-- Inequality (note the \lt) -->
When \(n \gt 100\), the approximation holds.

Quick Reference: Display Examples

<!-- Centered equation -->
\[y = mx + b\]

<!-- Summation -->
\[\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n\]

<!-- Integral -->
\[\int_0^1 x^2 \, dx = \frac{1}{3}\]

<!-- Matrix -->
\[\begin{pmatrix} a & b \\ c & d \end{pmatrix}\]

Why This Creates Accessible Math

When you use MathJax delimiters, Brightspace’s built-in MathJax library converts your LaTeX into structured MathML. This means:

Screen readers can navigate equation parts
Students can zoom without pixelation
The math is searchable and selectable

📖

Want deeper understanding? Learn how MathJax and MathML work together in Understanding MathML and MathJax.

Troubleshooting

My equation shows raw LaTeX code

Check your delimiters. Brightspace uses $...$ and \[...\], not the dollar sign delimiters ( $...$ ) common in other systems.

Part of my equation is missing

Look for angle brackets. If you used < or > directly, HTML interpreted them as tags. Replace with \lt and \gt.

The visual editor mangles my code

Stay in HTML view until your equation is complete. Some WYSIWYG editors aggressively reformat pasted content. Type or paste your math while in HTML source mode, then switch back.

Type	Delimiter	Result
Inline	`\(...\)`	Math flows within your sentence
Display	`\[...\]`	Math appears centered on its own line