note Goes Dark: Which Chart Background Works Better?

2026-8-21

note has added dark mode support
More than half of users keep dark mode always on
Use KaTeX syntax to create tables

Introduction

Hello, this is Easygoing.

Today, I’d like to take a closer look at the dark mode that officially launched on the note browser version on August 13, 2026.

Anime girl gazing at a smartphone in a neon-lit night cityscape. Illustration capturing the dark mode atmosphere — This article focuses on note’s dark mode display.

Dark Mode Is Easier on the Eyes

First, let’s look at how note actually appears in dark mode.

Side-by-side comparison of a note article in light mode

Side-by-side comparison of a note article in dark mode

note’s dark mode uses a black background with lower light emission, making it gentler on the eyes by reducing brightness—especially helpful indoors at night.

Dark Mode Began Spreading in 2016

Dark mode started gaining popularity around 2016.

Although some websites and apps had offered dark mode as a custom feature earlier, it began to spread in earnest when Windows 10 officially adopted a dark theme on August 2, 2016.

gantt
    title Dark Mode Support Timeline
    dateFormat YYYY-MM-DD
    axisFormat %Y

    section OS
    Windows 10                        : 2016-08-02, 2026-08-20
    macOS Mojave                      : 2018-09-24, 2026-08-20
    Android 10                        : 2019-09-03, 2026-08-20
    iOS 13                            : 2019-09-19, 2026-08-20

    section Browser
    Safari                            : 2019-03-25, 2026-08-20
    Firefox                           : 2019-05-21, 2026-08-20
    Chrome                            : 2019-07-30, 2026-08-20

    section App
    Twitter / X                       : 2016-07-26, 2026-08-20
    YouTube                           : 2017-05-02, 2026-08-20
    note (iOS App)                    : crit, 2022-01-18, 2026-08-20
    note (Android App)                : crit, 2022-11-25, 2026-08-20
    note (Browser)                    : crit, 2026-08-13, 2026-08-20

Between 2019 and 2020, major browsers added support for the prefers-color-scheme property, and it was standardized when it was included in the W3C web standards draft on March 3, 2020.

note’s iOS and Android apps already supported dark mode in 2022. With the latest update bringing support to the web version (including PC), nearly all users can now view pages in dark mode.

How note’s Dark Mode Algorithm Works

note’s dark mode display follows this logic:

Load the setting from the previous visit (Cookie: note_theme_mode)
Check the user’s device setting (prefers-color-scheme)
Default to light theme

note uses a small text file stored on the user’s device—called a Cookie—to restore the light/dark mode preference from the previous visit.

Anime girl lying in bed in a dark bedroom, looking at her smartphone screen. Illustration suggesting nighttime dark mode use — note switches to dark mode based on the user’s settings.

If the Cookie is missing or inaccessible, note reads the OS or browser dark mode setting on the user’s device.

If neither can be read, it falls back to the default light mode.

Is Dark Mode Always On?

So how many users keep dark mode enabled on a daily basis?

According to an Android Authority reader survey conducted from March to June 2026 with 3,110 votes, 73.3% of respondents said they keep dark mode always on.

Poll confirms: You're probably reading this on dark mode - Android Authority

Always keep dark mode on: 73.31%
Switch as needed: 5.79%
Automatically switch by time of day: 15.24%
Do not use dark mode: 5.66%

Additionally, a 2023 ComputerBase community survey found that 59.3% of users (across PC and mobile devices) keep dark mode always on.

Hell oder dunkel: Nutzt ihr Dark Modes? Und wenn ja, wo und wann? - ComputerBase

While respondents to tech-article surveys may have higher dark mode adoption than the general public, it’s still plausible that more than half of users already use dark mode regularly, and that share is expected to keep growing.

Should Charts Prioritize Dark Mode?

note handles dark mode for the article itself, so creators don’t need to worry about the text layout.

However, when using charts or tables in an article, you need to decide whether to prioritize light mode or dark mode.

White and Black background chart

Bar chart with white background. Ranking of world language speakers (English 149 million, Chinese 118 million, etc.).

Bar chart with black background. Ranking of world language speakers. Example chart for dark mode

For charts, a white background suits light mode, while a black background suits dark mode.

Until now, I had prioritized the light theme and used white-background graphs. Now that dark mode is standard on note, I’ve decided to switch to black backgrounds going forward, prioritizing dark mode.

note Cannot Display Markdown Tables

When writing on note, we use Markdown syntax.

Markdown is a simplified web markup language mainly aimed at technical users. Its key strength is that it is easy for both humans and machines to read.

About Markdown input on note

Why Is note the Ultimate Platform!? Save Your Articles in Markdown! | AI Image Journey

In pure Markdown, creating tables is straightforward. However, on note the Markdown table feature is disabled.

Tables can also be used to alter page layout, so note may have intentionally disabled them to keep the display simple.

note Supports KaTeX Tables

Although note cannot create Markdown tables, it does support tables written in KaTeX syntax.

KaTeX is a library developed for writing mathematical formulas in a lightweight, high-speed way, and note has implemented this functionality.

Masato’s detailed guide to KaTeX tables

noteに表(テーブル)を書く具体的な方法を徹底解説｜マサト | AI×note×SNS初心者ガイド

White and Black background table

Table with white background. List of major AI models showing release date, developer, country of origin, and open-weight status (from ChatGPT to MiniMax)

Table with black background. List of major AI models showing release date, developer, country of origin, and open-weight status. Designed for dark mode

KaTeX table

\newcommand{\arraystretch}{1.5} % \small \begin{array}{|c|c|c|c|c|} \hline \text{Model Name} & \text{Release Date} & \text{Developer} & \text{Country} & \text{Open Weight} \cr \hline \text{ChatGPT} & \text{Nov 2022} & \text{OpenAI} & \text{USA} & \cr \hline \text{Claude} & \text{Dec 2022} & \text{Anthropic} & \text{USA} & \cr \hline \text{GLM} & \text{Mar 2023} & \text{Zhipu AI} & \text{China} & \bigcirc \cr \hline \text{Llama} & \text{Feb 2023} & \text{Meta} & \text{USA} & \bigcirc \cr \hline \text{Falcon} & \text{May 2023} & \text{TII} & \text{UAE} & \bigcirc \cr \hline \text{Qwen} & \text{Aug 2023} & \text{Alibaba} & \text{China} & \bigcirc \cr \hline \text{Mistral} & \text{Sep 2023} & \text{Mistral AI} & \text{France} & \bigcirc \cr \hline \text{Kimi} & \text{Oct 2023} & \text{Moonshot AI} & \text{China} & \bigcirc \cr \hline \text{DeepSeek} & \text{Oct 2023} & \text{DeepSeek AI} & \text{China} & \bigcirc \cr \hline \text{Nemotron} & \text{Nov 2023} & \text{NVIDIA} & \text{USA} & \bigcirc \cr \hline \text{Grok} & \text{Nov 2023} & \text{xAI} & \text{USA} & \cr \hline \text{Gemini} & \text{Dec 2023} & \text{Google} & \text{USA} & \cr \hline \text{Phi} & \text{Dec 2023} & \text{Microsoft} & \text{USA} & \bigcirc \cr \hline \text{MiniMax} & \text{Jan 2024} & \text{MiniMax} & \text{China} & \bigcirc \cr \hline \end{array}

Code to paste directly into the note editor

$
\newcommand{\arraystretch}{1.5} %
\small
\begin{array}{|c|c|c|c|c|}
\hline
\text{Model Name} & \text{Release Date} & \text{Developer} & \text{Country} & \text{Open Weight} \cr
\hline
\text{ChatGPT} & \text{Nov 2022} & \text{OpenAI} & \text{USA} & \cr
\hline
\text{Claude} & \text{Dec 2022} & \text{Anthropic} & \text{USA} & \cr
\hline
\text{GLM} & \text{Mar 2023} & \text{Zhipu AI} & \text{China} & \bigcirc \cr
\hline
\text{Llama} & \text{Feb 2023} & \text{Meta} & \text{USA} & \bigcirc \cr
\hline
\text{Falcon} & \text{May 2023} & \text{TII} & \text{UAE} & \bigcirc \cr
\hline
\text{Qwen} & \text{Aug 2023} & \text{Alibaba} & \text{China} & \bigcirc \cr
\hline
\text{Mistral} & \text{Sep 2023} & \text{Mistral AI} & \text{France} & \bigcirc \cr
\hline
\text{Kimi} & \text{Oct 2023} & \text{Moonshot AI} & \text{China} & \bigcirc \cr
\hline
\text{DeepSeek} & \text{Oct 2023} & \text{DeepSeek AI} & \text{China} & \bigcirc \cr
\hline
\text{Nemotron} & \text{Nov 2023} & \text{NVIDIA} & \text{USA} & \bigcirc \cr
\hline
\text{Grok} & \text{Nov 2023} & \text{xAI} & \text{USA} & \cr
\hline
\text{Gemini} & \text{Dec 2023} & \text{Google} & \text{USA} & \cr
\hline
\text{Phi} & \text{Dec 2023} & \text{Microsoft} & \text{USA} & \bigcirc \cr
\hline
\text{MiniMax} & \text{Jan 2024} & \text{MiniMax} & \text{China} & \bigcirc \cr
\hline
\end{array}
$

One drawback of KaTeX tables is that on some devices Japanese text may render in a serif (Mincho) font, which can look inconsistent with the sans-serif body text. The upside is that they automatically follow light/dark mode switching.

KaTeX syntax can feel difficult at first, but you can export a table from Excel or a spreadsheet as CSV or Markdown, then ask ChatGPT, Gemini, or another AI to convert it into KaTeX. Until you get comfortable, letting AI handle the conversion is a good approach.

A Request to note: Please Publish Dark Mode Usage Rates!

I submitted a request via https://www.help-note.com/hc/ja/requests/new asking note to publish light-mode / dark-mode usage statistics.

Anime girl holding a smartphone under blue neon lights. Image representing a request for note to publish dark mode usage rates — note’s standard may become the web’s standard.

note is a massive content platform with over 12 million registered users. Releasing this kind of data would be highly meaningful for understanding web-wide standards.

The help center likely receives a huge volume of requests, so there’s no guarantee it will reach the relevant team. Still, I’m looking forward to a reply that could help us write better on note.