Dark Mode for Canvas LMS Without Breaking Course Content

Canvas's website doesn't have a dark mode. Its mobile apps have a dark appearance option, but in a browser you need an extension, and the trick is getting one that darkens the pages without making diagrams, videos and PDFs unreadable.

What Canvas offers on its own

• Mobile apps: the Canvas Student and Teacher apps can follow your phone's dark mode.
• Web: under Account → Settings, Canvas has accessibility options such as a high contrast interface. They make text easier to read, but they're not a dark theme.

Getting dark mode on Canvas in Chrome

A dark mode extension darkens Canvas the same way it darkens any site. What matters for coursework is how it treats images and embedded content. Modern Dark Mode darkens the page and then flips images, videos and embedded frames back to their normal colors, so:

• course images, charts and diagrams keep their real colors;
• lecture videos and embedded YouTube clips look normal;
• PDFs and documents shown in Canvas's previewer stay as they are, usually white pages.

Since previews stay bright, lower the brightness slider a little if a white PDF on a dark page feels glaring. If you only study at night, set the schedule so dark mode turns on in the evening.

Where dark mode can cause trouble

• Color-coded content. Tables, rubrics or text that use color to carry meaning (red for wrong, green for right) change color in an inverted page. When the color matters, check the page with dark mode off.
• Quizzes and exams. To be safe, turn dark mode off before a timed quiz so nothing looks different from what your instructor intended. Some proctoring tools also require you to disable extensions.
• Rich text you write. If you color text in a discussion post or assignment, the colors you see in dark mode aren't the ones your instructor will see.

Turning it off for Canvas only

If you'd rather keep Canvas in its normal colors, add it to Modern Dark Mode's excluded sites. Use your school's Canvas address, which often looks like yourschool.instructure.com or a custom address such as canvas.yourschool.edu. Dark mode stays on for the rest of the web.

Using Canvas on a Chromebook

School Chromebooks are usually managed, and your school may not allow you to install extensions. If you can't add one, ChromeOS's own dark theme (Settings → Personalization) darkens the system menus but not Canvas pages. For reading comfort, larger text (Ctrl and +) and lower screen brightness help in the meantime.