Help changing color of headers 2023

What I’m trying to do

I am completely new to obsidian. I want to change color of the headings and customize them.

Things I have tried

I already read this:

but not working, and the answer is not that well detailed, since obsidian.css file is not easy to find. then I found the CSS snippets, created my file: heading_colors and added this command:
h1 { color: blue; }
h2 { color: red; }
h3 { color: cyan; }
but nowhtin changed.
Then I looked up to this tutorial:
it is well done but not much detailed for a zero zero level, like me. I tried out many options but still not found a way to just change the colors of the headings.

if someone can help me I could be greatful!

The first question is what theme are you using? What CSS works or not will vary by theme.

If you are using the default theme (and many others), this will work for Editing and Reading views:

body {
    --h1-color: var(--color-red);
    --h2-color: var(--color-orange);
    --h3-color: var(--color-yellow);
    --h4-color: var(--color-green);
    --h5-color: var(--color-blue);
    --h6-color: var(--color-purple);

The var(... sections can be replaced with red, #ff0000, etc.

1 Like

Hi, I am using the Default mode.
thank you very much for your answer! it is working!

while reading other things I found also this code, do you know what is the difference between your method and this one?

/******* HEADING COLORS *******/
.markdown-preview-view h1,
  color: red;

.markdown-preview-view h2,
  color: darkgreen;

.markdown-preview-view h3,
  color: blue;

.markdown-preview-view h4,
  color: violet;

.markdown-preview-view h5,
  color: lightblue;

.markdown-preview-view h6,
  color: azure;

Obsidian has Editing and Reading views.

In this case, .markdown-preview-view h1 is for Reading/rendered view.

.cm-header-1 is for Editing view (Source and Live Preview; different but still Editing view).

The custom properties in the snippet I shared are convenient to take care of both Editing and Reading modes together. Sometimes they aren’t enough to do what you want, but most of the time they are fine.

In this case both snippets are doing more or less the same thing.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.