# Set light/dark mode
From the account settings, you can preset the space overview and the color mode when reading notes.


### Setting the interface color mode for your account
Select the dark/light color mode for the workspace overview and other interface displays, or follow the system default.
### Setting the reading color mode
Select the dark/light color mode for notes displayed in reading mode, page view, or by default.
### Apply custom styles
This option is turned off by default. When you browse a note that contains custom styles such as HTML syntax, CSS syntax, etc., turning on Apply Custom Styles will give priority to applying the layout or color style settings of that note.

 

# Set editor theme
By using the <i class="fa fa-paint-brush" aria-hidden="true"></i> icon below the editor, you can choose the background and text color theme of the editor. The default setting is Neo Dark, which is the commonly seen dark-themed editor appearance.


&nbsp;

# Change View theme in Both mode
When you are in Both mode, you can choose the theme color for the preview on the right side. The switch button is located in the top right corner in the <i class="fa fa-paint-brush" aria-hidden="true"></i> brush menu.

>[!Tip] This setting applys to the view page.
>When set to Light mode, clicking the link will display it in Light mode by default.
>When set to dark mode, clicking the link will display it in Dark mode by default.

▲ **Click to open the theme option**

&nbsp;

# Set View page theme
Even in View page, you can freely change the note's display between light and dark mode.

▲ **The option displayed in the top right corner of the page.**

&nbsp;

# Customized CSS
If you have applied custom CSS to your notes, both the Both mode and the View page will have an additional option for **"Custom CSS"**.


>[!Note]How to change theme/text color through CSS?
>Check these :point_down:
>- [Change text color](/@docs/change-text-color-en)
>- [Embedding another note](/@docs/embed-another-note-en)