CSS snippet that gives the active line a different color

Share & showcase
#1

Giving the active line a different background color helps us to know where the cursor is and where we are working right now in the note.

Dec-23-2021 15-58-53


/*for legacy editor*/
.CodeMirror-activeline.CodeMirror-linebackground{
  background-color: #468eeb33;
}


/*for live preview mode*/
.cm-active.cm-line{
  background-color: #468eeb33;
}
10 Likes
#2

Thanks for sharing.

Angel :angel:

#3

@GLight : thanks a lot for this. I had the snippet for CM5 but not for CM6, which is where most of my Obsidian time is spent.

1 Like
#4

Lovely! Works great for me! Thank you for the snippet.

1 Like
#5

Thanks, this works well!
One question that I have: In the theme I use, the legacy editor deactivates the background-color of the active line as soon as some text is selected.
Now in live preview this does not seem to be the case so that I need to use two different background-colors for selection and active line. I really liked the old behaviour - is it possible to regain it also in live preview?

#6

It does not work for me - every other css code does work except for active line for some reason :frowning: