CSS for horizontal lines

I think I have a very simple question for people that are familiar with css :slight_smile: I want to change the color of the horizontal lines.

My background color in dark mode has the same color as the horizontal lines that are added when embedding notes for example. So far I didn’t find any example of how to do achieve it and everything I tried failed.

In whatever theme CSS you are using you would need to find .markdown-preview-view hr. That contains a border-color. In my theme that variable was var(--background-modifier-border) but you can change that, either to another variable, OR if you don’t know what all the variables look like (I don’t either, but depending on your code IDE you can see them visually represented within the CSS file) you can also set it to a regular color value, such as #ff9900 for bright orange or #0099ff for a blue line.

So, it could look something like this in the CSS:

.markdown-preview-view hr {
    border: none;
    border-top: 1px solid;
    border-color: #ff0000; /* Bright red */
}

Thanks that works, for some lines, I’m happy with that. But it seems another issue remains. When embedding another note, obsidian adds a line above and below the embedded note, these are not affected by this. Do you also know how/where to change these?

I found it:

.markdown-preview-view .markdown-embed { border-color: #ff0000; }
1 Like

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